sureshd
sureshd

Reputation: 565

how to get checkbox and textbox value present in a particular row of a table using javascript or jquery

I am trying to get checkbox and textbox value present in a particular row of a table. Below code is working fine in IE7 and not in IE8,9

HTML

<table id="tblSrc">
   <tr>
        <td><input type="checkbox" name="firstrowchkbox"></td>
        <td><input type="text" name="firstrowtxtbox"></td>
   </tr>
   <tr>
        <td><input type="checkbox" name="secondrowchkbox"></td>
        <td><input type="text" name="secondrowtxtbox"></td>
   </tr>
</table>

SCRIPT

var tbl = document.getElementById("tblSrc");
var firstrowchkval = tbl.rows[0].cells[0].firstChild.value
var firstrowtxtval = tbl.rows[0].cells[1].firstChild.value

How can i get the values using js or jquery by supporting all browsers

Upvotes: 0

Views: 2131

Answers (4)

Shaunak D
Shaunak D

Reputation: 20626

Demo

You can use jQuery selectors,

  • :first : Retrieves first-child.
  • :eq(n) : Retrieves nth child.

$('#tblSrc tr:first input[type="text"]').val();
$('#tblSrc tr:first input[type="checkbox"]').val();

to know whether the checkbox is checked or not use ,

$('#tblSrc tr:first input[type="checkbox"]').prop('checked')

Or if you need to get text from specific <td>

$('#tblSrc tr:eq(0) td:eq(0)').text();
$('#tblSrc tr:eq(0) td:eq(1)').text();

Upvotes: 1

Balachandran
Balachandran

Reputation: 9637

use .each to get all the input value

$("#tblSrc").find("td input").each(function(){
    alert(this.value)

});

or get single value based on type selector

var catchElement = $("#tblSrc").eq(0);
catchElement.find("[type=text]").val();
catchElement.find("[type=checkbox]").val();

Upvotes: 1

K.K.Agarwal
K.K.Agarwal

Reputation: 856

try this.. If you want specific row.. then can place eq(1) for 2nd row

chkval = $('#tblSrc tr:eq(0) [type="checkbox"]').val();
 txtval = $('#tblSrc tr:eq(0) [type="text"]').val();

Upvotes: 1

Milind Anantwar
Milind Anantwar

Reputation: 82231

You can use:

 firstrowchkval = $('#tblSrc tr:eq(0) [type="checkbox"]').val();
 firstrowtxtval = $('#tblSrc tr:eq(0) [type="text"]').val();

Upvotes: 1

Related Questions