Click or drag to resize
KaxToolBarOnClientButtonClicking Property
Gets or sets a value indicating the client-side event handler that is called just prior to clicking a toolbar button item (KaxToolBarButton or KaxToolBarSplitButton).

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 OnClientButtonClicking { 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 OnClientButtonClicking property to specify a JavaScript function that will be executed prior to button item clicking - either by left-clicking it with the mouse or hitting enter after tabbing to that button. You can cancel that event (prevent button clicking) 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 item being clicked
    • cancel - whether to cancel the event
    • domEvent - the reference to the browser DOM event

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

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

alert("You are clicking the '" + button.get_text() + "' button in the '" + toolBar.get_id() + "' toolBar.");

if (button.get_text() == "Right")
{
alert("Right alignment is not available");
eventArgs.set_cancel(true);
}
}
</script>

<kettic:KaxToolBar id="KaxToolBar1" runat="server" OnClientButtonClicking="clientButtonClicking">
<Items>
<kettic:KaxToolBarButton Text="Left"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right"></kettic:KaxToolBarButton>
<kettic:KaxToolBarDropDown Text="Align">
<Buttons>
<kettic:KaxToolBarButton Text="Left"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right"></kettic:KaxToolBarButton>
</Buttons>
</kettic:KaxToolBarDropDown>
<kettic:KaxToolBarSplitButton Text="Right">
<Buttons>
<kettic:KaxToolBarButton Text="Left"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Center"></kettic:KaxToolBarButton>
<kettic:KaxToolBarButton Text="Right"></kettic:KaxToolBarButton>
</Buttons>
</kettic:KaxToolBarSplitButton>
</Items>
</kettic:KaxToolBar>

See Also