Confused on jQuery val

Question

I was under the impression when using val it automatically set the value of any text box named in the selector. I have several input text boxes and would like them all to be set using val:

<input type="text" id="firstName" name="firstName" size="20" class="gotowp-input-text required">
<input type="text" id="lastName" name="lastName" size="20" class="gotowp-input-text required">
<input type="text" id="email" name="email" size="20" class="gotowp-input-text required email">

I have two sets of these input text boxes, and I am trying to set them both with:

jQuery(document).ready(function($){
$("#firstName").val("Test");
$("#lastName").val("Test2");
$("#email").val("test@test.net");
});

Please see:

https://jsfiddle.net/bg1pdbw2/

jQuery will set the first selector it sees but not the second one. They have the same name. Thank you guys!

score 1 · Accepted Answer · answered Jul 17 '16 at 22:00

1

You cannot re-use IDs. You've picked the same ID for the same input, which is not allowed.

Instead, consider selecting your inputs by their names:

$('input[name="lastName"]').val('Test2');

Working example: https://jsfiddle.net/bg1pdbw2/3/

answered Jul 17 '16 at 22:00

Brad

159,648
54
349
530

Thank you so much. I tried that but because of my php code it was conflicting with the outer parenthesis. I needed to remove the inner double parenthesis, and change the outer to double. Thank you Brad – zduffy Jul 18 '16 at 17:49

score 0 · Answer 2 · answered Jul 17 '16 at 21:59

0

The basic rule for Id's to have a unique Id per page. Use class instead of Id so that it will work.

answered Jul 17 '16 at 21:59

vvr02

611
2
12
22

http://stackoverflow.com/questions/33601687/difference-between-id-and-class – vvr02 Jul 17 '16 at 22:01
check above link for more details – vvr02 Jul 17 '16 at 22:02
Right. I get that, but this code was being generated through php and did not want to mettle with the php. Thank you! – zduffy Jul 18 '16 at 17:50

Confused on jQuery val

2 Answers2