$(this).attr('id') has no value in .each()
When the "Get Id's of tables with errors" button is pressed I see...
- 2 (which is the correct count, based on the initial state)
- The alert "each func called"
- Next I see alert a blank alert box
- Then alert "each fun called" again for the second table
- Then another blank alert box
I have tried several different ways to retrieve attributes from each of the table elements returned, but failed each time. Strangely I am able to affect the tables. For example if the "hideTablesWithErrors" button is clicked the tables are hidden one by one. Why can't I get the id of each table? Am I doing something wrong? Plz help.
- <html>
<head>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
function getIdsOfTablesWithErrors() {
var tablesWithCheckedErrors = $('table[id^=Error] :has(tr td input:checked)');
alert(tablesWithCheckedErrors.size());
tablesWithCheckedErrors.each(function(){
alert('each func called');
alert( $(this).attr('id') );
});
}
- function hideTablesWithErrors() {
var tablesWithCheckedErrors = $('table[id^=Error] :has(tr td input:checked)');
alert(tablesWithCheckedErrors.size());
tablesWithCheckedErrors.each(function(){
$(this).hide();
});
}
</script>
</head>
<body>
<button onclick="getIdsOfTablesWithErrors();">Get Id's of tables with errors</button>
- <button onclick="hideTablesWithErrors();">Hide tables with errors</button>
<table id="ErrorTable1">
<tr><td>Error</td><td><input type="checkbox" name="e1" checked="checked"/></td></tr>
</table>
<table id="ErrorTable2">
<tr><td>Error</td><td><input type="checkbox" name="e2"/></td></tr>
</table>
<table id="ErrorTable3">
<tr><td>Error</td><td><input type="checkbox" name="e3" checked="checked"/></td></tr>
</table>
</body>
</html>