CODEWITHSUNDEEP
javascripthtml
InvalidSyntax
InvalidSyntax

Reputation: 9505

Setting value of all input fields with X ID using JS

I am using JS to set multiple forms which have the following hidden input.

<input type="hidden" name="sGUID" id="sGUID" value="">

Using my JS function I use 

document.getElementById("sGUID").value = "my value goes here";

The problem is this only sets the last instance of the sGUID to the value set. How can I ensure all of them are set to this?

Upvotes: 1

Views: 113

Answers (4)

zmag
zmag

Reputation: 8251

You can't have the same id value.

If you have sGUID as name values, try the below:

var sGUIDs = document.getElementsByName("sGUID");

for (var i = 0; i < sGUIDs.length; i++) {
    sGUIDs[i].value = "my value goes here";
}
<input type="hidden" name="sGUID" value="1">
<input type="hidden" name="sGUID" value="2">
<input type="hidden" name="sGUID" value="3">

Upvotes: 1

InvalidSyntax
InvalidSyntax

Reputation: 9505

This is actually a rewrite of @zmag's response, just in shorthand.

document.getElementsByName('sGUID').forEach(function(ele, idx) {
   ele.value = 'TESTVALUE';
})

Upvotes: 1

R3tep
R3tep

Reputation: 12864

You can use querySelectorAll and loop to change all inputs value

let inputs = document.querySelectorAll('input[name="sGUID"]');
for(let l = inputs.length;l--;){
   inputs[l].value = "my value goes here";
}

Upvotes: 2

imvain2
imvain2

Reputation: 15857

Use classes as IDS must be unique and loop through them.

let guids = document.getElementsByClassName("sGUID");
let newstring = "string";
for(let z = 0;z < guids.length;z++){
   guids[z].value = newstring;
}
<input type="hidden" name="sGUID" class="sGUID" value="">
<input type="hidden" name="sGUID" class="sGUID" value="">
<input type="hidden" name="sGUID" class="sGUID" value="">
<input type="hidden" name="sGUID" class="sGUID" value="">

Upvotes: 3

Related Questions