yab86
yab86

Reputation: 405

JQuery takes the wrong value

An easy question for you I think :-)

<form id="upload" method="post" name="form">  
<input id="id<?php echo $a; ?>" class="id" name="id" type="text" value="<?php echo $id_submit; ?>" >
<input style="margin-top:-5px;width:29px;" class="submit" type="image" src="save.jpg">
</form>

The source code looks e.g. like this:

Form 1:

<form id="upload" method="post" name="form">  
<input id="id1" class="id" name="id" type="text" value="12345" >
<input style="margin-top:-5px;width:29px;" class="submit" type="image" src="save.jpg">
</form>

Form 2:

<form id="upload" method="post" name="form">  
<input id="id2" class="id" name="id" type="text" value="65432" >
<input style="margin-top:-5px;width:29px;" class="submit" type="image" src="save.jpg">
</form>

After click on save.jpg it calls my jquery-function:

$(document).ready(function() {                              
                           $( "#upload" ).on("submit", function(e) {

                               e.preventDefault();

                                               var id = $('.id').val();
                                               …..

The problem is that when I click on save.jpg in the form 2, then it takes the value 12345 instead of 65432.

How can I fix that?

Upvotes: 0

Views: 70

Answers (3)

yab86
yab86

Reputation: 405

That works:

var id = $(this).('.id').val();

Thanks for your help guys.

Upvotes: 0

Wilmer
Wilmer

Reputation: 2511

Use a broader selector to target both forms then find the id of the current submitted form:

$( "form" ).on("submit", function(e) {

    e.preventDefault();

    var id = $(this).find('.id').val();//"this" is the current form

Upvotes: 1

dreamweiver
dreamweiver

Reputation: 6002

the form is needs to be unique

<form id="upload" method="post" name="form">

thats why it takes the first element found in the dom structure with the target id, change the id of the second form .

Also when you do

var id = $('.id').val();

there a more than one element with the given class. you can try this instead

var id = $(this).find('.id').val();

Happy Coding :)

Upvotes: 2

Related Questions