Jquery - Input name value not changing but id is?

Question

I'm trying to change the value of this HTML code by using input name:

<input class="string required" first_and_last="true" id="high_billing_name" name="high[billing_name]" required="required" size="20" type="text">

When I use the Input id to change the value it works:

$("#high_billing_name").val('NAME');

But I'm trying to change the value using the name instead of the id. I've tried $('input[name="high[billing_name]"]').val("NAME");and other forms of that but it doesn't work.

Answer 1

This example is using JQuery, it is straight forward:

$('input[name="high[billing_name]"]').val("Johnny Bravo");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="string required" first_and_last="true" id="high_billing_name" name="high[billing_name]" required="required" size="20" type="text">

Also, this version using JQuery, but I use \ to print the ":

$('input[name=\"high[billing_name]\"]').val("Johnny Bravo");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="string required" first_and_last="true" id="high_billing_name" name="high[billing_name]" required="required" size="20" type="text">

But this one is using pure javascript:

var imput = document.getElementById("high_billing_name");
imput.value = "Johnny Bravo";

<input class="string required" first_and_last="true" id="high_billing_name" name="high[billing_name]" required="required" size="20" type="text">

Answer 2

Maybe it depends on the jquery version or even browser version? The syntax you use should work.

$('input[name="high[billing_name]"]').val("NAME")

I created a simple fiddle for it and this one works for me in Chrome 54.

https://jsfiddle.net/mpdozfqc/

Answer 3

Try this. $('input[name=\"high[billing_name]\"]').val("NAME");