Click or drag to resize
KaxToolBarOnClientCheckedStateChanging Property
Gets or sets a value indicating the client-side event handler that is called just prior to changing the state of a checkable KaxToolBarButton.

Namespace: Kettic.AspNet.Controls
Assembly: Kettic.AspNet.Controls (in Kettic.AspNet.Controls.dll) Version: 2014.4.1129.0 (2014.04.1129.0)
Syntax
public string OnClientCheckedStateChanging { get; set; }

Property Value

Type: String
A string specifying the name of the JavaScript function that will handle the event. The default value is empty string.
Remarks

Use the OnClientCheckedStateChanging property to specify a JavaScript function that will be executed prior to button checked state changing - either by left-clicking a checkable button or pressing the ENTER key after tabbing to that button. You can cancel that event (prevent button checked state changing) by seting the cancel property of the event argument to true.

Two parameters are passed to the handler

  • sender (the client-side KaxToolBar object)
  • eventArgs with three properties
    • item - the instance of the button which checked state is being changed
    • cancel - whether to cancel the event
    • domEvent - the reference to the browser DOM event (null if the event was initiated by calling a client-side method such as button.toggle())

Examples
The following example demonstrates how to use the OnClientCheckedStateChanging property.

<script language="javascript">
function clientCheckedStateChanging(sender, eventArgs)
{
var toolBar = sender;
var button = eventArgs.get_item();

alert(String.format("You are about to change the checked state of the '{0}' button in the '{1}' toolBar.", button.get_text(), toolBar.get_id()));

if (item.get_text() == "Left" && item.get_group() == "Align")
{
alert("You cannot change the checked state of the 'Align Left' button!");
eventArgs.set_cancel(true);
}
}
</script>

<kettic:KaxToolBar id="KaxToolBar1" runat="server" OnClientCheckedStateChanging="clientCheckedStateChanging">
<Items>
<kettic:KaxToolBarButton Text="Left" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarDropDown Text="Align">
<Buttons>
<kettic:KaxToolBarButton Text="Left" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
</Buttons>
</kettic:KaxToolBarDropDown>
<kettic:KaxToolBarSplitButton Text="Reset">
<Buttons>
<kettic:KaxToolBarButton Text="Left" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right" CheckOnClick="true" Group="Align" ></kettic:KaxToolBarButton>
</Buttons>
</kettic:KaxToolBarSplitButton>
</Items>
</kettic:KaxToolBar>

See Also