Use a normal link to submit a form

Styling your submit button as a link

Disguise your submit button as a friendly, non-threatening link using CSS wizardry:

.link-like-button {
    background: none;
    border: none;
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

.link-like-button:hover,
.link-like-button:focus {
    text-decoration: none;
}


<form id="form-bruce-wayne">
    <!-- form elements -->
    <input class="link-like-button" type="submit" value="Submit Form">
</form>


These styles strip the button of its usual business attire and dress it up as a casual link.

Deploying image-based submit buttons

<form id="picture-this">
    <!-- form entries -->
    <input type="image" src="your-image.png" alt="Submit Form" />
</form>


In the above script, the selected image also doubles as the Bat-Signal, calling form's submit() method to action.

Submit action via JavaScript EventListener

Deploy your JavaScript sidekick with an EventListener for more form control:

document.querySelector('.link-in-disguise').addEventListener('click', function(e) {
    e.preventDefault(); // Keeping the normal link behavior at bay
    let form = this.closest('form'); // Locate the nearest form lurking in the shadows
    
    if(form) {
        form.submit(); // Engage form submission
    }
});


Advanced form control with AJAX

document.querySelector('.ajax-link').addEventListener('click', function(e){
    e.preventDefault();

    let formData = new FormData(document.querySelector('#ajax-form'));

    fetch('/submit', {
        method: 'POST',
        body: formData
    }).then(response => {
        // Handle server's response here. Cookies, anyone?
    });
});


In this approach, our link gets souped-up with AJAX capabilities, à la Batmobile.

Accessibility Matters

For accessibility reasons, consider using a <button> element and styling it as a link:

<form>
  <!-- form elements -->
  <button type="submit" class="link-like-button">Submit Form</button>
</form>


This maneuver lets screen readers in on the action, rendering your web page more inclusive.