In this article I will explain with an example, how to implement Client Side OnCheckChanged event for ASP.Net CheckBox using JavaScript.
This article will explain how to call a JavaScript function when an ASP.Net CheckBox is checked (selected) or unchecked (unselected).
Client Side OnCheckChanged event for ASP.Net CheckBox using JavaScript
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 JavaScript OnClick event handler.
When the CheckBox is clicked, the ShowHideDiv JavaScript function is executed. Inside this function, based on whether CheckBox is checked (selected) or unchecked (unselected), the HTML DIV with TextBox is shown or hidden.
<script type="text/javascript">
function ShowHideDiv(chkPassport) {
var dvPassport = document.getElementById("dvPassport");
dvPassport.style.display = chkPassport.checked ? "block" : "none";
}
</script>
<label for="chkPassport">
<asp:CheckBox ID="chkPassport" Text="Do you have Passport?" runat="server" onclick="ShowHideDiv(this)" />
</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 JavaScript]()
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
