jquery , asp.net - asp.net

Question

I am trying to use jquery to select a checkbox when another checkbox is selected. This wuld have been easy if the ids of the checkboxes are constant but they can change so I have tried to use classes instead, unfortunately asp.net applies the class name on the span element wrapping the checkbox instead of applying on the checkbox directly, so i need to get the checkbox via the inner element of the parent span
<script type="text/javascript">
$(document).ready(function() {
$('#ctl00_ContentPlaceHolder1_Category_ctl00_ProductBusinessLine_chkEL_157').click(function() {
if (this.checked) {
var pl = $('#ctl00_ContentPlaceHolder1_Category_ctl00_ProductBusinessLine_chkPL_313')
pl.attr("checked", true);
}
})
});
</script>
My code, previously working with the checkbox ids, is above, pls help!

Answer 1

You can still match your check boxes even if the class attribute is applied to their parent <span> elements:
$(document).ready(function() {
$(".sourceCheckBoxClass input:checkbox").click(function() {
if (this.checked) { // or $(this).is(":checked")
$(".targetCheckBoxClass input:checkbox").attr("checked", true);
}
});
});

Answer 2

With ASP.NET you can control the ClientId of the form controls. You have the use the Clientid property as I remember.
More info at the MSDN.

Answer 3

<script type="text/javascript">
$(document).ready(function() {
$('#ctl00_ContentPlaceHolder1_Category_ctl00_ProductBusinessLine_chkEL_157').click(function() {
if (this.checked) {
var pl = $('#ctl00_ContentPlaceHolder1_Category_ctl00_ProductBusinessLine_chkPL_313 :checkbox')
pl.attr("checked", true);
}
})
});
</script>
Is that what you're looking for ? oh and looks like you're using ids, not classes in your selectors

Answer 4

if you write your javascript code on the page, then you can determine real id dynamically:
$('#<$=chkEL_157.ClientID%>').click(function() {
...
});
or find element by a part of id:
$(':checkbox[id$="_chkEL_157"]').click(function() {
...
});
but in this case you must assure that there is no other element that contains similar id. Otherwise you must specify context where you want to find element, like this:
$(':checkbox[id$="_chkEL_157"]', $("#checkbox-context-element")).click(function() {
...
});