JavaScript Get Element by Name

JavaScript get element by name

The reason you're seeing that error is because document.getElementsByName returns a NodeList of elements. And a NodeList of elements does not have a .value property.

Use this instead:

document.getElementsByName("acc")[0].value

Vanilla JS - Get element by name of a div

Use getElementById to get the tag with id 'edit_pickup_date_modal'. Than search with querySelector for the first INPUT-field with name = 'type' and set the value.

document.getElementById('edit_pickup_date_modal').querySelector('input[name=type]').value=2;

<div id='edit_pickup_date_modal'>
  <div>
    <input name ='type'>
  </div>
</div>

Get elements by name that contain part of a string using Javascript

You can do it like this using querySelectorAll

let ele = document.querySelectorAll('select[name^=visitors]')
console.log(ele)

<select name="visitors10">   <option class="disableDuration4" value="5">5</option>   <option class="disableDuration5" value="6">6</option>   <option class="disableDuration6" value="7">7</option></select><select name="visitors11">   <option class="disableDuration4" value="5">5</option>   <option class="disableDuration5" value="6">6</option>   <option class="disableDuration6" value="7">7</option></select><select name="visitors12">   <option class="disableDuration4" value="5">5</option>   <option class="disableDuration5" value="6">6</option>   <option class="disableDuration6" value="7">7</option></select><select name="xyz"></select><select name="visitorsxyz"></select>

Get name of form element

var name = element.getAttribute("name");

Get element by part of Name or ID

Your best bet is probably document.querySelectorAll, which you can use any CSS selector with, including an "attribute starts with" selector like input[id^="id_qtedje_"]. It's supported on all modern browsers, and also IE8:

var elements = document.querySelectorAll('input[id^="id_qtedje_"]');

If you wanted just the first match (rather than a list), you could use document.querySelector instead. It returns a reference to the first match in document order, or null if nothing matched.

Alternately, you could give the elements a class name, then use document.getElementsByClassName, but note that while getElementsByClassName was supported in old versions of Chrome and Firefox, IE8 doesn't have it, so it's not as well-supported as the more-useful querySelectorAll in the modern era.

var elements = document.getElementsByClassName("theClassName");

If you use any libraries (jQuery, MooTools, Closure, Prototype, etc.), they're likely to have a function you can use to look up elements by just about any CSS selector, filling the gaps in browser support with their own code. For instance, in jQuery, it's the $ (jQuery) function; in MooTools and Prototype, it's $$.

get child node by name in javascript

document.querySelector('input[name="test1"]')

Or if you want to target a specific child of a specific element:

var test = document.querySelector('#test')
var test1 = test.querySelector('input[name="test1"]');
window.console.log(test1)

JavaScript Get Element by Name