21
Category: JQuery
Counting table row using jquery with click event

This type of operation is very easy using javascript / HTML-DOM . The jquery is more practising trend of time.

<!DOCTYPE html>

<html>

<head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>

 

$(document).ready(function(){

  $("#but1").click(function(){

    var rc = document.getElementById("myTable").rows.length;   /*we can use this also:   var $rc=$('#myTable tr').length;]  */

     alert(rc);

  });

});

 

</script>

</head>

<body>

 

<table id="myTable" border="1">

  <tr>

    <td>cell 1</td>

    <td>cell 2</td>

  </tr>

  <tr>

    <td>cell 3</td>

    <td>cell 4</td>

  </tr>

</table>

<br>

<button type="button" id="but1" >Show number of rows in table</button>

 

</body>

</html>