Question

117

Get element by part of Name or ID

rated 0 times [ 120] [ 3] / answers: 1 / hits: 58583 / 11 Years ago, mon, april 8, 2013, 12:00:00

Here is an example of my form (only inputs that I want, but there is many others):

<form name="inputform" action="..." method="post">

    <input type="hidden" name="id_qtedje_77" id="id_qtedje_77" value="0">

    <input type="text" id="id_qte_77" name="prestation_detail_fields[77][qte_collecte]" value="0.00">

    <input type="text" id="id_rec_77" name="prestation_detail_fields[77][reliquat_conforme]" value="0.00">

    <input type="text" id="id_ren_77" name="prestation_detail_fields[77][reliquat_non_conforme]" value="0.00">

    <input type="checkbox" name="prestation_detail_fields[77][dechet_non_present]" value="1">

    

    <!-- another TR -->

    

    <input type="hidden" name="id_qtedje_108" id="id_qtedje_108" value="0">

    <input type="text" id="id_qte_108" name="prestation_detail_fields[108][qte_collecte]" value="0.00">

    <input type="text" id="id_rec_108" name="prestation_detail_fields[108][reliquat_conforme]" value="0.00">

    <input type="text" id="id_ren_108" name="prestation_detail_fields[108][reliquat_non_conforme]" value="0.00">

    <input type="checkbox" name="prestation_detail_fields[108][dechet_non_present]" value="1">

</form>

What I want is to get values of inputs, but as the form is built in PHP, I don't know the line identifier (77, 108).

Is there a way to do something like getElementByName('id_qtedje_%') ?

Note: I'm not using any library, and I don't plan to use one.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tyreese

Add To Favorites

Follow

Total Points: 739

Total Questions: 95

Total Answers: 98

Location: Belize

Member since Mon, Jun 20, 2022

2 Years ago

answered 11 Years ago austynp · Accepted Answer

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 $$.