Ajax Form Submit issues

I’m trying to submit a form using ajax with the following link:

<a href="javascript:;" onclick="document.getElementById('new_form').submit();" class="link"><i class="far fa-check fa-2x"></i></a>

The form code is as follows:

<form method="POST" action="/documents/create" id="new_form" class="list form-ajax-submit">
    ...
</form>

When I click the link, the form is submitted, but not as Ajax.

Using the following code will submit the form by Ajax properly when clicking the submit button of the form:

<form method="POST" action="/documents/create" id="new_form" class="list form-ajax-submit">
    ...
    <input type="submit" value="Submit">
</form>

I’m on F7 V3.0.1.

Calling .submit() directly on element will submit it, it can’t be prevented. Use something like

$(‘form’).trigger(‘submit’)
1 Like