Getting a dynamic textbox name using javascript

Question

Please forgiving if the title is a little non-descriptive. Here is what im doing. Im making dynamic textboxes in a table using javascript. For example i add one row to the table, give the textbox a name for instance tname, i want to make each textbox unique so i add a row number to the end of it, so the textbox name is tname1, next would be tname2...etc. Now I want to create another function to loop through this table to get all of the values. Here is the code im using to get the value of the textbox below. I didnt put the for loop b/c I know that the loop works, b/c i got the correct number of rows.

txt = document.getElementById('tname' + a)
alert(txt.value)

I know that there is a function that you put around this: ('tname' + a) to let javascript know that your concatenating it together b/c i did it before just cant remember the function. If any can help, it would be very much appreciated

user447356 · Accepted Answer · 2011-08-10 15:09:21Z

2

If you assigned the id (not name) then dirty pure JavaScript work around is:

var a = 1;
while (true) {
    var id = 'tname' + a;
    var txt = document.getElementById(id);
    if (txt == null)
        break;
    alert("value of " + id + " is: " + txt.value);
    a++;
}

This will keep looking for elements, until it can't find any - hope this makes sense.

answered Aug 10, 2011 at 15:09

user447356

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

Comments

Joe · Accepted Answer · 2011-08-10 14:03:26Z

1

You need to use ID and name. For example,

<input type="text" name="tname1" />

should be

<input type="text" name="tname1" id="tname1"/>

answered Aug 10, 2011 at 14:03

Joe

82.9k18 gold badges130 silver badges147 bronze badges

Comments

SeanCannon · Accepted Answer · 2011-08-20 00:56:28Z

1

Use JQuery. It simplifies tasks like this:

$('input[type="text"]').map(function(){
    return (this.value.length > 0) ? this.value : null;
}).get().join(',');

Working demo: http://jsfiddle.net/AlienWebguy/wLteQ/

edited Aug 20, 2011 at 0:56

answered Aug 10, 2011 at 14:02

SeanCannon

78.1k17 gold badges126 silver badges145 bronze badges

1 Comment

Maverick Over a year ago

Love map()! Such a handy function.

Andreas Louv · Accepted Answer · 2015-11-06 13:33:11Z

1

Have you tried:

var els = document.getElementsByName(...);
// Or if you only focusing on newer browsers:
var els = document.querySelectorAll(..);

// els is now a HTMLCollection / NodeList
console.log(els[0].value);

edited Nov 6, 2015 at 13:33

answered Aug 10, 2011 at 14:07

Andreas Louv

47.3k14 gold badges109 silver badges126 bronze badges

Collectives™ on Stack Overflow

Getting a dynamic textbox name using javascript

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related