Can't set hidden input field's value using jQuery

user_255787 0
Viewed 99434

I have a simple input field inside a form tag:

<body>
  <form action="#">
      <label>Input</label>
      <input type="hidden" id="foo" name="foo" />

  </form>
</body>

I tried to set this value from a js file:

$(document).ready(function(){
    $('#foo').val('foo')
})

but in the html source the attribute isn't set at all. If I try to set the input type to "button" or anything else, it works. I just can't do it with a hidden input field. What am I doing wrong?

hidden-field jquery
11 Answers

Can you retrieve the value from the hidden field if you set the val tag?

e.g.

<input type="hidden" id="foo" name="foo" value="bar" />

$(document).ready(function(){
  alert($('#foo').val());
})
user_830960

I figured it out. The value was set by jQuery but when I viewed the source the new value wasn't shown. I tried this (thanks to Fermin):

$('#foo').val('poo')
alert($('#foo').val())

and it displayed the modified value.

user_2557870

I'd need to see the whole file but my guess is either you aren't including the jQuery.js source file or you have multiple elements with an ID of foo

Andrew_G_Johnson_4281900
Related