CODEWITHSUNDEEP
javascriptjquery
user1625066
user1625066

Reputation:

Jquery multiple forms in same page

I have the following dynamically generated HTML

<div id="1">
<form name = "inpForm">
<input name="FirstName" type="text"/>
<input type="submit" value="Submit"/>
</form>
</div>

<div id="2">
<form name = "inpForm">
<input name="FirstName" type="text"/>
<input type="submit" value="Submit"/>
</form>
</div>

The outer divs have different IDs but the form names are the same. I am using Jquery to perform some validation when the form is submitted. However, when the second form is submitted, I always get the values of the first form.

$(document).ready(function () {
    $('form[name="inpForm"]').live('submit', function () {
        alert($('input[name="FirstName"]').val());
        return false;
    });
});

How can I modify myJquery to find the "FirstName" element that matches the current form where the submit was triggered? Thanks

Upvotes: 0

Views: 4166

Answers (2)

Dr.Molle
Dr.Molle

Reputation: 117314

Use this (the form-element) as context-argument:

alert($('input[name="FirstName"]',this).val());

Upvotes: 1

Mike Robinson
Mike Robinson

Reputation: 25159

Add some context:

alert($(this).find('input[name="FirstName"]').val());

Upvotes: 7

Related Questions