<%@ Page Language="C#" %>
<%@ Register assembly="Coolite.Ext.Web" namespace="Coolite.Ext.Web" tagprefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Coolite Checkbox</title>
<style type="text/css">
.x-form-check-wrap { display: inline; }
</style>
</head>
<body>
<form id="form1" runat="server">
<div style="margin: 12px;">
<ext:ScriptManager ID="ScriptManager1" runat="server">
<Listeners>
<DocumentReady Handler="
Ext.get('lnkCheck').on(
'click',
function(){{Checkbox2}.setValue(!{Checkbox2}.getValue())});
" />
</Listeners>
</ext:ScriptManager>
<div style="margin-top: 30px;">
<h2>Basic Checkbox with Label</h2>
<br />
<ext:Checkbox ID="Checkbox1" runat="server" /> <asp:Label runat="server" Text="Subscribe?" />
</div>
<div style="margin-top: 30px;">
<h2>Checkbox with 'for' label and custom events</h2>
<br />
<ext:Checkbox ID="Checkbox2" runat="server">
<Listeners>
<Check Handler="Ext.Msg.alert('Event', (el.getValue()) ? 'Checked' : 'UnChecked');" />
</Listeners>
</ext:Checkbox> <label for="Checkbox2_Input">Subscribe?</label>
<br />
<br />
<a href="#" id="lnkCheck">Toggle Checkbox</a>
</div>
</div>
</form>
</body>
</html>