e p e p - 4 months ago 12
Javascript Question

Get the value of combined TDs of dynamically generated TRs

I am trying to get the values of inputs in a dynamically generated

tr
in to an array. How can I get the combined td values in an array?

<input type="button" id="button" value="Click Me" />

<table style="width:100%" id="sub1">
<tr>
<td>
<input class="myInpCls" type="text" />
</td>
<td>
<select class="mySelCls">
<option value="1">value 1</option>
<option value="2">value 2</option>
</select>
</td>
</tr>
<tr>
<td>
<input class="myInpCls" type="text" />
</td>
<td>
<select class="mySelCls">
<option value="3">value 3</option>
<option value="4">value 4</option>
</select>
</td>
</tr>
</table>


var onClick = function() {
var inputs = $("#sub1").find('.myInpCls');
for (var i = 0; i < inputs.length; i++) {
var el = inputs[i];
alert($(el).val());
}
};

$('#button').click(onClick);


I can pull input values using
.find('.myInpCls')
. How can I get the combined values here? Something like the array of
input1##value 1
,
input2##value 2
etc.

UPDATE:
I have a select box in the next td. I have to combine these 2 items. ie,the input value+corresponding select item.

Fiddle

Answer

Access the input directly with the #sub1 .myInpCls selector and loop them with each. Then you can access the input by $(this) inside the loop.

Your updated example.

$('#button').click(function() {
    $("#sub1 .myInpCls").each(function() {
        alert($(this).val());
    });
});
Comments