CODEWITHSUNDEEP
jquery
sherry
sherry

Reputation: 342

Get specific row from table using jQuery

I am trying to retrieve data from specific rows in a table based on check box selection done by the user.

For this, I have found two methods eq(rowIndex) and nth-child(rowIndex). However,it works only when given an absolute values and not when its dynamic.

Have tried the following but no luck on this:

function getData()
 {
    var chkArr = document.getElementsByName('checkbox');
    var checkedRecord = 0;
    for(var i=0; i<chkArr.length; i++)
    {   
    if(chkArr[i].checked)
    {
              checkedRecord = i;
              $('#summaryTable > tbody  > tr').eq('#checkedRecord').children('td').each(function(j)
            //checkedRecord is the row index here
             {
             //fetch values from td
             }); 
          }
      }  
 }

Here's how my html looks 

<table>
<tr>
    <td><input type="text" id="text1"></td>
    <td>
        <select>
            <option value="opt1">Orange</option>
            <option value="opt2">Green</option>
        </select>
    </td>
</tr>
<tr>..</tr>

Any suggestions on this?

Upvotes: 0

Views: 8308

Answers (4)

colestrode
colestrode

Reputation: 10668

I'm not exactly sure what you are asking for, but it seems you want to find the values of selects found in rows that correspond by index to checked checkboxes. This will allow you do do that:

function getData() {
    var rows = $('#summaryTable > tbody  > tr'), //cache rows for performance
        values = []; //array of values to return

    //iterate through all checkboxes
    $('input[type=checkbox]').each(function (i) { 
        if(this.checked) {
            //if checkbox is checked, find select and get value, then add to values array
            values.push(rows.eq(i).find('select').val()); 
        }
    });

    return values;
}

Upvotes: 0

Habibillah
Habibillah

Reputation: 28705

eq method need integer value as parameter, but you pass a selector syntax to this method. Look at your code at line:

$('#summaryTable > tbody  > tr').eq('#checkedRecord')....

You have define checkedRecord variable above as var checkedRecord = 0;. So you need to modify that line to become:

$('#summaryTable > tbody  > tr').eq(checkedRecord)....

Upvotes: 1

Manish Sharma
Manish Sharma

Reputation: 2426

try this,

var gridRows = $("#myTable tbody tr");
var qnt = gridRows[i].cells[2].childNodes[0].value;

and if you want all rows data so use this function

function GridCount() {
        var grid = $("#myTable tbody");
        var gridRows = $("#myTable tbody tr");
        var gridfootRows = $("#myTable tfoot tr");
        var subTotal = 0;
        var Id;
        var Name;
        for (var i = 0; i < gridRows.length; i++) {
            if (isFireFox()) {
                Id = gridRows[i].cells[0].childNodes[0].innerHTML;
                Name = gridRows[i].cells[1].childNodes[0].innerHTML;
            }
            else {
                Id = gridRows[i].cells[0].innerText;
                Name = gridRows[i].cells[0].innerText;
            }
            var qnt = gridRows[i].cells[2].childNodes[0].value;
            var price = gridRows[i].cells[3].childNodes[0].value;
            var total = parseFloat(price * qnt).toFixed(2);
            gridRows[i].cells[4].childNodes[0].innerHTML = total;
            subTotal = parseFloat(subTotal) + parseFloat(total);
        }

}
function isFireFox() {
   return navigator.appName == "Netscape";
}

Upvotes: 0

Barmar
Barmar

Reputation: 782508

You want something like this:

$('#summaryTable > tbody  >  tr').eq(i).children('td')
    .each(function() { ... });

The argument to eq must be a number.

There's also no need for the checkedRecord variable, it's the same as i.

Upvotes: 1

Related Questions