calling a jquery function in form submit button

Question

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?

glutaminefree · Accepted Answer · 2016-01-31 12:21:06Z

2

This enought:

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

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

edited Jan 31, 2016 at 12:21

answered Jan 30, 2016 at 21:32

glutaminefree

3822 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

charlie Over a year ago

if i call the function inside this, could i use $(this); to get the ID of the form?

glutaminefree Over a year ago

Yes, you can use $(this).attr('id') for getting ID of form tag.

Iwnnay · Accepted Answer · 2016-01-30 21:43:42Z

1

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>

edited Jan 30, 2016 at 21:43

answered Jan 30, 2016 at 21:34

Iwnnay

2,01818 silver badges21 bronze badges

20 Comments

charlie Over a year ago

can i use $(this); inside the .submit when calling the function ?

Iwnnay Over a year ago

Yes. Inside the function $(this) will be the form wrapped in jQuery.

charlie Over a year ago

so i could use $('#my-form').submit(function(e) { form_post($(this)); });

Iwnnay Over a year ago

oh you wouldn't have to call form_post anymore. Instead you're just telling the form what to do on submission.

charlie Over a year ago

but i want to run this function to post the form

|

Collectives™ on Stack Overflow

calling a jquery function in form submit button

2 Answers 2

2 Comments

20 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

20 Comments

Your Answer

Sign up or log in

Post as a guest

Related