Version

ClientSideEvents Property (WebButtonBase)

List of client-side events that can be processed by the application.
Syntax
'Declaration
 
Public ReadOnly Property ClientSideEvents As ButtonClientSideEvents
public ButtonClientSideEvents ClientSideEvents {get;}
Remarks

Every member property can contain the name of implemented function or explicit javascript statement(s). If the name of a function (only name: no parenthesis or parameters) is used, then actual implementation on client may contain parameters: please see documentation for Client-Side Object Model.

Example
ClientSideEvents allows to process button events on browser, cancel some events, trigger postback, modify painting, etc. Events include standard events of browser such as mousedown, keydown, focus and composite or custom events such as mouseout, click, paint.

' Codes in code behind:
Me.WebImageButton1.ClientSideEvents.Click = "clickButton1"
Me.WebImageButton1.ClientSideEvents.Paint = "paintButton1"
Me.WebImageButton1.ClientSideEvents.KeyDown = "keyButton1"
' Note: if codes above are written within aspx, then it reduces the size of hidden ViewState passed to client


' Below are codes in aspx (or any other script file loaded to client)

<script language="javascript">

// function called before WebImageButton1 gets the click event
function clickButton1(oButton, oEvent)
{
	// if click was triggered by the Space key, then cancel click
	if(oEvent.action == "1")
		oEvent.cancel = true;
	// if click was triggered by the AccessKey, then cancel automatic post back to server
	if(oEvent.action == "3")
		oEvent.cancelPostBack = true;
}

// function called while painting of WebImageButton1
function paintButton1(oButton, oEvent)
{
	// get reference to html element that renders text of button
	var span = oButton.getElementAt(3);
	var border = "0";
	// draw red solid border around text when button in pressed state
	if(oButton.getState() == 4)
		border = "1px solid red";
	span.style.border = border;
}

// function called when WebImageButton1 gets the keydown event
function keyButton1(oButton, oEvent)
{
	// if the Escape key was pressed, then trigger post back to server
	if(oEvent.event.keyCode == 27)
		oEvent.needPostBack = true;
}
</script>
// Codes in code behind:
this.WebImageButton1.ClientSideEvents.Click = "clickButton1";
this.WebImageButton1.ClientSideEvents.Paint = "paintButton1";
this.WebImageButton1.ClientSideEvents.KeyDown = "keyButton1";
// Note: Note: if codes above are written within aspx, then it reduces the size of hidden ViewState passed to client


// Below are codes in aspx (or any other script file loaded to client)

<script language="javascript">

// function called before WebImageButton1 gets the click event
function clickButton1(oButton, oEvent)
{
	// if click was triggered by the Space key, then cancel click
	if(oEvent.action == "1")
		oEvent.cancel = true;
	// if click was triggered by the AccessKey, then cancel automatic post back to server
	if(oEvent.action == "3")
		oEvent.cancelPostBack = true;
}

// function called while painting of WebImageButton1
function paintButton1(oButton, oEvent)
{
	// get reference to html element that renders text of button
	var span = oButton.getElementAt(3);
	var border = "0";
	// draw red solid border around text when button in pressed state
	if(oButton.getState() == 4)
		border = "1px solid red";
	span.style.border = border;
}

// function called when WebImageButton1 gets the keydown event
function keyButton1(oButton, oEvent)
{
	// if the Escape key was pressed, then trigger post back to server
	if(oEvent.event.keyCode == 27)
		oEvent.needPostBack = true;
}
</script>
Requirements

Target Platforms: Windows 10, Windows 8.1, Windows 8, Windows 7, Windows Vista SP1 or later, Windows XP SP3, Windows Server 2008 (Server Core not supported), Windows Server 2008 R2 (Server Core supported with SP1 or later), Windows Server 2003 SP2

See Also