Stazh
Stazh

Reputation: 207

Can't set value on hidden input element

I have a problem setting value of an hidden input element. I've tried using jQuery and $("#SomeHiddenElement").val(sSomeValue) function, and plain JS document.getElementById("SomeHiddenElement").value = sSomeValue; but nothing works...

When I set the element to text type it works just fine...

The problem persists both in FF and IE.

Any ideas?

Code:

<input type="hidden" id="SomeHiddenElement" name="SomeHiddenElement" value="" />

document.getElementById("SomeHiddenElement").value = "Testing";

Upvotes: 3

Views: 17371

Answers (6)

zborecque
zborecque

Reputation: 431

I know it's been a long time, but I had the same issue, and it took me some time to find out that I had more than one element ( to be exact) on page with the same id="" and it seemed that my JS function did not work (which I guess it was modifying value of just the first element). Anyway, this may help someone save some time investigating :)

Upvotes: 0

ReverseEMF
ReverseEMF

Reputation: 536

These both work:

$('#SomeHiddenElement').attr("value", "some text");
$('#SomeHiddenElement').val("some text");

Verified using Chrome Developer Tools and Firebug

Upvotes: 0

Stazh
Stazh

Reputation: 207

Guys I'm so sorry... The problem was in combination of Firebug and my post handling code... I've fixed it...

Moral of the story: double check code and don't blindly believe Firebug.

Thanks for your trouble!

Upvotes: 3

annakata
annakata

Reputation: 75794

Since I don't believe firebug has a problem updating it's DOM representation, and your code works fine in isolation, and you don't have an issue with text inputs, and I've never had a problem updating hidden inputs myself, I would suggest that something else is acting on hidden inputs to block what you're doing.

I suggest you create a test page stripped of all content except what you've given us here and then incrementally add features to progress towards the state of your real page. At some point it will break and you'll at least know where the problem lies.

Upvotes: 7

Michael Mao
Michael Mao

Reputation: 10158

Can you try:

$('#SomeHiddenElement').attr("value", "some text");

this is just a simple jQuery solution to set the attribute "value" with test text.

Edit:

Well, try this:

alert($("input[type='hidden']").length);

This is to see how many hidden input elements on your page.

Upvotes: 0

Daniel Vassallo
Daniel Vassallo

Reputation: 344291

Your code is fine.

<!DOCTYPE html>
<html>
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Setting the value of a hidden field</title> 
</head> 
<body> 
  <input type="hidden" id="SomeHiddenElement" value="">
  <script>
    document.getElementById('SomeHiddenElement').value = 'Hello World';
  </script>

  <script>
    // Will alert 'Hello World'
    alert(document.getElementById('SomeHiddenElement').value);
  </script>
</body> 
</html>

How are you testing that the value of the hidden field is not being set? Since hidden fields are invisible, you can see what's inside when with JavaScript, or when you post the form.

Upvotes: 1

Related Questions