In this article I will explain with an example, how to implement Client Side OnCheckChanged event for ASP.Net CheckBox using jQuery.
This article will explain how to call a jQuery event handler when an ASP.Net CheckBox is checked (selected) or unchecked (unselected).
Client Side OnCheckChanged event for ASP.Net CheckBox using jQuery
The HTML Markup consists of an ASP.Net CheckBox and an HTML DIV consisting of an ASP.Net TextBox. The CheckBox has been assigned a jQuery OnClick event handler.
When the CheckBox is clicked, a jQuery event handler is executed. Inside this jQuery event handler, based on whether CheckBox is checked (selected) or unchecked (unselected), the HTML DIV with TextBox is shown or hidden.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=chkPassport]").click(function () {
if ($(this).is(":checked")) {
$("#dvPassport").show();
} else {
$("#dvPassport").hide();
}
});
});
</script>
<label for="chkPassport">
<asp:CheckBox ID="chkPassport" Text="Do you have Passport?" runat="server"/>
</label>
<hr />
<div id="dvPassport" style="display: none">
Passport Number:
<asp:TextBox ID="txtPassPort" runat="server" />
</div>
Screenshot
![Implement Client Side OnCheckChanged event for ASP.Net CheckBox using jQuery]()
Browser Compatibility
The above code has been tested in the following browsers.
![Internet Explorer]()
![FireFox]()
![Chrome]()
![Safari]()
![Opera]()
* All browser logos displayed above are property of their respective owners.
Demo
Downloads
