How can I set the value of a hidden input field using Jquery?

Question

I am attempting to set the value of a hidden input field to the same as the value of a clicked link.

This is what I have attempted which doesnt work:

$(document).ready(function(){
$(".delete_link").click(function(){
        var deleteID = $(this).attr("data-value"); 
        $("#delete_value").attr("value") = deleteID;
    });
});

The variable deleteID is correctly set.

and the form for reference:

<form name="delete_form" action="delete_post.php" method="POST">
    <p>Please confirm you want to delete this post.</p>
    <input type="submit" id="delete_submit" name="delete_submit" value="confirm" />
    <input type="hidden" id="delete_value" value="" />
</form>

Use jQuery's data API for retrieving data-* attributes, don't use attr('data-*') — Madbreaks
– Madbreaks, Commented Apr 26, 2013 at 16:24
Careful with the submit action. Even if the click trigger is raised, the form will be submitted and there are no warranty that your hidden field will have the value set up. You should handle the submit event of the form and not the delete click. — gustavodidomenico
– gustavodidomenico, Commented Apr 26, 2013 at 16:30

Andrew Lewis · Accepted Answer · 2013-04-26 16:34:01Z

3

use the val method

$("#delete_value").val(deleteID);

also for data attributes you might want to use the data method

$(this).data('value');

links:

edited Apr 26, 2013 at 16:34

Andrew Lewis

5,2941 gold badge29 silver badges32 bronze badges

answered Apr 26, 2013 at 16:24

house9

20.7k9 gold badges57 silver badges62 bronze badges

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

2 Comments

Terry Young Over a year ago

You've overridden the 2nd edit's correction of the syntax error. Somehow I couldn't correct it myself.

house9 Over a year ago

looks like somebody else fixed it

VisioN · Accepted Answer · 2013-04-26 16:24:58Z

1

For all form elements you need to use .val():

$("#delete_value").val(deleteID);

answered Apr 26, 2013 at 16:24

VisioN

146k35 gold badges287 silver badges291 bronze badges

Comments

gustavodidomenico · Accepted Answer · 2013-04-26 16:36:00Z

0

A complete example you (http://jsfiddle.net/79HEY/):

HTML

<form id="deleteform" action="delete_post.php" method="POST">
    <p>Please confirm you want to delete this post.</p>
    <input type="submit" data-id="100" id="delete_submit" name="delete_submit" value="confirm" />
    <input type="hidden" id="delete_value" value="" />
</form>

JavaScript

$(document).ready(function(){
    $("#deleteform").submit(function(){
        var deleteID = $("#delete_submit").data("id");
        $("#delete_value").val(deleteID);
        return true;
    });
});

answered Apr 26, 2013 at 16:36

gustavodidomenico

4,6911 gold badge37 silver badges50 bronze badges

Collectives™ on Stack Overflow

How can I set the value of a hidden input field using Jquery?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related