How to get the value of a input fields by. name using parent element id in jQuery?

Question

I have to enable some place holder text on the textfield. Example of the code set is below.

<div id="shipping">
  <input type="text" id="dynamic_id_2" name="telephone">
  <input type="text" id="dynamic_id_3" name="fax">
</div>
<div id="billing">
  <input type="text" id="dynamic_id" name="telephone">
  <input type="text" id="dynamic_id_1" name="fax">
</div>

I am using querySelector to access this elements.

var input = document.querySelector('input[name="telephone"]');

I want to access both telephone filed to update the placeholder. Whenever i am access by name i can access only the first div input element only. I want to access the input element using the parent div id.

Kindly notice input text fields ID is always dynamic and i can access only by the name

How can i do this?

tacoshy · Accepted Answer · 2022-11-18 07:38:10Z

1

Since you have a fixed ID for the container, you an sue querySelector to select the container and then the name attribute such as document.querySelector('#shipping [name="telephone"]'):

let tel = document.querySelector('#shipping [name="telephone"]');
let fax = document.querySelector('#shipping [name="fax"]');


// just for demo purpose
tel.value = '666666';
fax.value = '123456';

<div id="shipping">
  <input type="text" id="dynamic_id_2" name="telephone">
  <input type="text" id="dynamic_id_3" name="fax">
</div>
<div id="billing">
  <input type="text" id="dynamic_id" name="telephone">
  <input type="text" id="dynamic_id_1" name="fax">
</div>

answered Nov 18, 2022 at 7:38

tacoshy

13.3k5 gold badges22 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to get the value of a input fields by. name using parent element id in jQuery?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related