Farook
Farook

Reputation: 35

How to get textbox value from a textbox inside HTML Table cell using javascript

I have created a HTML table programmatically using javascript, similar to the code below:

function AddRow() {
   var rowcount  = $('#tabBillDet tr').length + 1;
   $('#tabDet tr:last').after("<tr><td><input type='text' id='txtItemCode' style='width:80px' /> </td></tr>");

I want to get the values entered in this textboxes.

I tried the following:

var tab = $('#tabDet tr');
for (var i = 0; i < tab.length; i++) {
    var group = $(tab[i].cells[0].children[0]).val();
    var ItemCode = $(tab[i].cells[1].children[0]).val();
}

I have tried by making the ID unique by giving each textbox a seperate ID depending on the row count.

But this is not working. How can I get those values?

Upvotes: 0

Views: 8891

Answers (3)

MasNotsram
MasNotsram

Reputation: 2273

It looks like you're assigning the same ID to multiple elements. IDs are unique, as they identify elements in the DOM uniquely. Instead, make the ID a class:

$('#tabDet tr:last').after("<tr><td><input type='text' class='txtItemCode' style='width:80px' /> </td></tr>");

And then you can get the values like so:

$('#tabDet tr .txtItemCode').each(function(){
   var ItemCode = $(this).val();

   //Do something with ItemCode.
});

Upvotes: 3

Priyank
Priyank

Reputation: 1384

Try this,

$('#tabBillDet tr').each(function() {
        var ItemCode = $("#txtItemCode", $(this)).val();
     });

Upvotes: 0

kevpoccs
kevpoccs

Reputation: 635

your var is overwrite at each iteration for the for loop, declare var group and itemcode before as an Array, and just put values in your arrays

var tab = $('#tabDet tr');
var group = [], ItemCode= [];
for (var i = 0; i < tab.length; i++) {
  group.push($(tab[i].cells[0].children[0]).val());
  ItemCode.push($(tab[i].cells[1].children[0]).val());
}

but what you want do with this values ? why you don't work with id ?

Upvotes: 0

Related Questions