I need to disable all the check boxes inside a table cell when clicking on a hyperlink inside the same table.
I\'m using the following jquery code to select all the
Disable?
$("a.clickme").click(function(){
$(this) // Link has been clicked
.closest("td") // Get Parent TD
.find("input:checkbox") // Find all checkboxes
.attr("disabled", true); // Disable them
});
or Checked?
$("a.clickme").click(function(){
$(this) // Link has been clicked
.closest("td") // Get Parent TD
.find("input:checkbox") // Find all checkboxes
.attr("checked", false); // Uncheck them
});
Your code can be a lot simpler:
$el = $(this).parents('table:eq(0)')[0].children('input[type="checkbox"]');
Could be:
$el = $(this).parents('table:first :checkbox');
Then to disable them:
$el.attr('disabled', 'disabled');
or to check them:
$el.attr('checked', 'checked');
or to uncheck them:
$el.removeAttr('checked');
or to enable them:
$el.removeAttr('disabled');
// Enable/Disable All Checkboxes
$('#checkbox').click(function() {
var checked = $(this).attr('checked');
var checkboxes = '.checkboxes input[type=checkbox]';
if (checked) {
$(this).attr('checked','checked');
$(checkboxes).attr('disabled','true');
} else {
$(this).removeAttr('checked');
$(checkboxes).removeAttr('disabled');
}
});
------------------------------- HTML Code below ------------------------------
<table id="myTable">
<tr>
<td><input type="checkbox" checked="checked" /></td>
<td><input type="checkbox" checked="checked" /></td>
<td><input type="checkbox" /></td>
<td><input type="checkbox" /></td>
</tr>
</table>
<input type="button" onclick="callFunction()" value="Click" />
------------------------------- JQuery Code below -----------------------------
<script type="text/javascript">
function callFunction() {
//:
$('table input[type=checkbox]').attr('disabled', 'true');
}
</script>
$('table input[type=checkbox]').attr('disabled','true');
if you have an id for the table
$('table#ID input[type=checkbox]').attr('disabled','true');
See also: selector/checkbox
jQuery("#hyperlink").click(function() {
jQuery('#table input:checkbox').attr('disabled', true);
return false;
});