charlie
charlie

Reputation: 481

calling a jquery function in form submit button

i have this jquery function:

function post_form(form_id) {
    $( form_id ).submit(function(e) {
        CheckRequired(e);
        var postData = $(this).serializeArray();
        var formURL = $(this).attr("action");
        LoadModalBody('<h2 align="center">Loading...</h3><p align="center"><i class="fa fa-refresh fa-spin fa-5x"></i></p>', 'Loading');
        $.ajax({
            url : '/section' + formURL,
            type: "POST",
            data : postData,
            success:function(data, textStatus, jqXHR) {
                LoadModal('/section' + formURL, 'Mileage');

                //$("body").html(data);
                //data: return data from server
            },
            error: function(jqXHR, textStatus, errorThrown) {
                //if fails
            }
        });
        e.preventDefault(); //STOP default action
        e.unbind(); //unbind. to stop multiple form submit.
    });
}

i want to call it in a HTML form submit button

i know i can use onClick="post_form(); but how do i put the form id in the call, i think using this would be the submit button and not the form?

Upvotes: 0

Views: 4347

Answers (2)

glutaminefree
glutaminefree

Reputation: 382

This enought:

$('#form-id').submit(function(e){
  // code for validate or ither staff
});

Just remove first and last line of code in your example.

Upvotes: 2

Iwnnay
Iwnnay

Reputation: 2008

Normally you put this code at the top of the page and attribute it directly like this:

<!DOCTYPE html>
<html>
<head>
<script src="jquery.min.js"></script>
<script>
$(function(){
    $('#my-form').submit(function(e) {
        ...
    });
});
</script>
</head>
<body>
    <form id="my-form">
        ...
        <input type="submit" value="Click me to submit form" />
    </form>
</body>
</html>

Upvotes: 1

Related Questions