Tom78
Tom78

Reputation: 7

jQuery, javascript: several forms same submit button text - how to determine value of closest hidden value box

I have several forms in HTML, each with a submit button and a hidden field. The same javascript function is called when any of the submit buttons are pushed. I want to know which submit button has been pushed. I think I can do this by finding out what the hidden field value is of the corresponding form - but I'm having difficulty with this. My HTML is:

<div id="existingPhotosList">
<table><tbody><tr><td>
    <img src="./userPictures/IMG0001.jpg">
</td>
<td>
    <form class="deleteFiles">
        <input type="hidden" name="picture" value="IMG0001.jpg">
        <input type="submit" name="deleteFile" value="Delete File">
    </form>
</td>
</tr>
<tr>
<td>
    <img src="./userPictures/IMG0002.jpg">
</td>
<td>
    <form class="deleteFiles">
        <input type="hidden" name="picture" value="IMG0002.jpg">
        <input type="submit" name="deleteFile" value="Delete File">
    </form>
</td>
</tr>
</tbody>
</table>
</div>

There may be more or less table rows with images and forms on them - depending on how many images are found on the server.

The javascript I have right now is:

$('.deleteFiles').submit(deleteFile);

function deleteFile()  {

    var myValue = $(this).parent().closest(".picture").val();
    alert(myValue);

    return false;

} 

I'm currently getting undefined as the result of the alert.

Upvotes: 0

Views: 144

Answers (4)

A. Wheatman
A. Wheatman

Reputation: 6386

the simplest way I think will be:

var myValue = $('input[name=picture]', this).val();

Upvotes: 1

Mir Gulam Sarwar
Mir Gulam Sarwar

Reputation: 2648

here is the demo http://jsfiddle.net/symonsarwar/963aV/

$('.deleteFiles').click(deleteFile);
function deleteFile()  {
var me=$(this).closest('tr').find('td:eq(1) input').val();
    alert(me)
}

Upvotes: -1

jmore009
jmore009

Reputation: 12923

should be:

var myValue = $(this).closest(".deleteFiles").find("input[type=hidden]").val();

Upvotes: 0

T.J. Crowder
T.J. Crowder

Reputation: 1074909

I want to know which submit button has been pushed.

As each of your forms only has one submit, you don't have to change your code much.

this in your submit handler will refer to the form, and the element is within the form, so:

var myValue = $(this).find("input[name=picture]").val();

No need to go up to the parent, and closest goes up the ancestry (through ancestors), not down. find goes down (descendants).

Upvotes: 2

Related Questions