current community

your communities

more stack exchange communities

Stack Exchange
tour help
careers 2.0
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

Hi I have a problem in assign single values to multiple input boxes. i am trying many ways but it assign only 1 text box. How can I assign multiple text boxes.

Note: I have the same ID for all input boxes.

My code is given below

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function getInputs()
{
  var inputs = document.getElementsByTagName('input');
  var ids = new Array();
  for(var i = 0; i < inputs.length; i++)
  {
    if(inputs[i].getAttribute('id').toLowerCase()== 'myid')
    {       
       document.getElementsById('myid').value="1";
    }
  }   
}    
window.onload = getInputs;
</script>
</head>
<body>
<form>
  <input type="text"  id="myid"><br>
  <input type="text"  id="myid"><br>
  <input type="text"  id="myid"><br>
  <input type="text"  id="myid"><br>
</form>
</body>
</html>

Can anyone help?

share|improve this question
add comment

3 Answers

up vote 1 down vote accepted

It only assigns a value to one of because ID's should be unique; therefore you're only actually going to end up targetting the first one with that value assignment.

Change your HTML to use a class instead:

<input type="text"  class="myids"><br>
<input type="text"  class="myids"><br>
<input type="text"  class="myids"><br>
<input type="text"  class="myids"><br>

Then, you can adapt your JavaScript accordingly.

jQuery

in jQuery, you could then set a value using:

$('.myids').val('value for all of them here');

jQuery jsFiddle here.

Pure JavaScript

In Javascript, you'd use getElementsByClassName() and iterate through them, giving them the same value.

var x = document.getElementsByClassName('myids');
for(i = 0; i < x.length; i++) {
  x[i].value = "New!";
}

Pure JavaScript jsFiddle here.

share|improve this answer
1  
+1, had the same problem some time bak! –  Ishank Dubey May 3 '13 at 9:45
1  
Thank you so much –  Nathan Srivi May 3 '13 at 10:10
add comment
up vote 0 down vote

The id attribute is supposed to be unique so having the same id several times is invalid html and most browsers will simply ignore any inputs with ids that already exist int he dom tree.

Sidenote: To set the value of several ids (via jquery) use the val() function and a selector that selects all respective inputs like this (it looks alot more cleaner to have this in a one-liner as opposed to sticking to pure javascript):

$('#myid1, #myid2, .myclass1').val('new value');
share|improve this answer
add comment
up vote 0 down vote

First of all ids are supposed to be unique. So add a class or name attribute instead. But your main problem is here:

document.getElementsById('myid').value="1";

It should be

inputs[i].value="1";

You already have the element, there is no need to find it again.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.