views:

344

answers:

3

Hi

I would like to know how I can control the 'Enabled' property of a button based on the 'checked' value of a checkbox:

<asp:CheckBox ID="chkEnableButton" runat="server" />
<asp:Button ID="btnLoadForm" runat="server" />

I can do this very easily on the server side - but I require this to be done on client side only, meaning JavaScript. Would the OnCheckedChanged attribute allow me to call some JavaScript to do this....or is it strictly for calling a handler in the code-behind?

Just to clarify, when the checkbox is checked, the button is enabled... when the checkbox is unchecked the button is disabled.

A: 

You can use here ClientID attribute so you can get the control on client side via javascript using document.getElementById or document.forms[0].elements[clientID].

function enableButton() {

$get('<%= btnLoadForm.ClientID %>').disabled = !$get('<%= chkEnableButton.ClientID %>').checked;

}

<asp:CheckBox ID="chkEnableButton" runat="server" OnClientClick="enableButton()" />
Ramiz Uddin
It might be cleaner to use the `$get` shortcut there. See http://www.asp.net/ajax/documentation/live/ClientReference/Global/GetShortCutMethod.aspx
Cloud
Done. Thanks for reminding me.
Ramiz Uddin
A: 

This SO question might give you a hint of how to do this. In your situation however, instead of changing the text of the Checkbox, find the Button control on your page and change it's disabled property.

Cloud
+2  A: 

Javascript:

<script type="text/javascript">
function checkButt(obj) {
    document.getElementById('<%=btnLoadForm.ClientID%>').disabled = !obj.checked;
}
</script>

Web Controls:

<asp:CheckBox ID="chkEnableButton" runat="server" OnClientClick="checkButt(this);" />
<asp:Button ID="btnLoadForm" runat="server" />
o.k.w