Get HTML Table RowIndex on Button Click using JavaScript and jQuery

SajidHus...

SOLVED CLOSED ACTIVE ANSWERED
User: SajidHussa
Posted: on Aug 09, 2019 06:03 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 26736
Sample Code: Download

how can i get row index of html table on button click

<td><input type="button" id="imgbtnedit1" value="" class="imgbtnedit"onclick="EditRecordForEditDemo(this)" /></td>

Download FREE API for Word, Excel and PDF in ASP.Net

dharmend...

0 4

Reply
ANSWER
User: dharmendr
Replied: on Aug 09, 2019 06:32 AM
Report

Hi SajidHussa,

Check this example. Now please take its reference and correct your code.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>HTML Table RowIndex</title>    
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        function EditRecordForEditDemo(element) {
            var rowJavascript = element.parentNode.parentNode;
            var rowjQuery = $(element).closest("tr");
            alert("JavaScript Row Index : " + (rowJavascript.rowIndex - 1) + "\njQuery Row Index : " + (rowjQuery[0].rowIndex - 1));
        }
    </script>
</head>
<body>
    <table border="1" cellpadding="1" cellspacing="1">
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Country</th>
            <th>Action</th>
        </tr>
        <tr>
            <td>1</td>
            <td>John Hammond</td>
            <td>United States</td>
            <td><input type="button"  value="Show" class="imgbtnedit" onclick="EditRecordForEditDemo(this)" /></td>
        </tr>
        <tr>
            <td>2</td>
            <td>Mudassar Khan</td>
            <td>India</td>
            <td><input type="button" value="Show" class="imgbtnedit" onclick="EditRecordForEditDemo(this)" /></td>
        </tr>
        <tr>
            <td>3</td>
            <td>Suzanne Mathews</td>
            <td>France</td>
            <td><input type="button" value="Show" class="imgbtnedit" onclick="EditRecordForEditDemo(this)" /></td>
        </tr>
        <tr>
            <td>4</td>
            <td>Robert Schidner</td>
            <td>Russia</td>
            <td><input type="button" value="Show" class="imgbtnedit" onclick="EditRecordForEditDemo(this)" /></td>
        </tr>
    </table>
</body>
</html>

Demo

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Get HTML Table RowIndex on Button Click using JavaScript and jQuery

Company

Explore

Follow us

Contact Us