dsynkd
dsynkd

Reputation: 2145

I find the table but can't get the ID

I have the piece of html below. The table is used for JQgrid.

<section id="section_students">
<table id="grid_students"></table>
<a class="btn" href="#">Click</a>
</section>

And I'm intending to use JQuery to find out the value of the table if a button under the same section is clicked.

$("section a.btn").click(function(){
var curGrid = $(this).parent().find('table').get(0);
alert($(curGrid).attr("id"));
});

This alert will return 'undefined' and I can't understand why.
What am I missing?

EDIT: Looks like JQGrid changes the ID of the table, which is weird. I'll be researching this, meanwhile, if anyone knows how to prevent this behavior, please let me know.

Upvotes: 0

Views: 97

Answers (4)

Oleg
Oleg

Reputation: 221997

jqGrid converts the original <table> (<table id="grid_students"></table> in your example) in complex structure of tabeles and dives. The most simple modification of your original code could be

$("section a.btn").click(function(){
    var curGrid = $(this).parent().find('table.ui-jqgrid-btable').get(0);
    alert($(curGrid).attr("id"));
});

(I use the fact that jqGrid set ui-jqgrid-btable class on the original <table>).

Upvotes: 1

Chinmay235
Chinmay235

Reputation: 3414

Please put your code in $(document).ready(function(){ ...... });

$(document).ready(function(){
    $("section a.btn").click(function(){
    var curGrid = $(this).parent().find('table').get(0);
    alert($(curGrid).attr("id"));
    });
});

Upvotes: 0

Baron.Zhao
Baron.Zhao

Reputation: 31

It works well, did you put the javascript code into jquery ready().

$(function(){
    $("section a.btn").click(function(){
    var curGrid = $(this).parent().find('table').get(0);
    alert($(curGrid).attr("id"));
    });
});

Upvotes: 0

A Beginner
A Beginner

Reputation: 447

Try this

$("#section_students").find("a.btn").click(function(){
var curGrid = $(this).parent().find('table').get(0);
alert($(curGrid).attr("id"));
});

Upvotes: 0

Related Questions