CODEWITHSUNDEEP
javascriptjqueryajaxjquery-plugins
Paisal
Paisal

Reputation: 1331

Multi form submit in the page with ajaxform()

how to get the parent div id of current submit form with the ajaxform plugin
I am not having any problems with the success state

Thank you.

below is my code.

<script type="text/javascript" charset="utf-8">
$('.formsubmit').ajaxForm( { 

    beforeSubmit: function() {
        // here want form parent div display loading..
        var id = $(this).parent().id; // my problem here how to get current action form parent div id 
        $('div#'+id).html("Loading...");
    },
    url: '/post.php',
    success: Response,
    datatype: ($.browser.msie) ? "text" : "xml"
});
function Response(xml) {
    // let say XML return is equal 1
    var id = xml;
    $('div#'+id).html("Success");
}
</script>

<html>
<body>
<div id="1">
    <form class='formsubmit' action='/post.php' method='post'>
        <input name='url' value='stackoverflow.com'>
    </form>
</div>
<div id="2">
    <form class='formsubmit' action='/post.php' method='post'>
        <input name='url' value='jquery.com'>
    </form>
</div>
<div id="3">
    <form class='formsubmit' action='/post.php' method='post'>
        <input name='url' value='google.com'>
    </form>
</div>
</body>
</html>

Upvotes: 1

Views: 1225

Answers (1)

RaYell
RaYell

Reputation: 70414

From what I can see in the docs, beforeSubmit method is invoked with three params:

  • the form data in array format
  • the jQuery object for the form
  • the Options Object passed into ajaxForm/ajaxSubmit

Given that if you change your before submit to

beforeSubmit: function(formData, formObj, options) {
    var id = formObj.parent().attr('id');
    $('div#'+id).html("Loading...");
}

This should work although I haven't tested it.

Upvotes: 3

Related Questions