August 2012 | C# Guide - C#, Asp.Net, MVC, LINQ, jQuery and SharePoint Resources

Wednesday, August 29, 2012

Asp.net button OnClientClick Confirm Message

The Asp.Net button has 2 attributes to trigger a click event OnClick and OnClientClick.

OnClientClick – Calls the client side (JavaScript) event handler
OnClick – Calls the server side (code-behind) event handler

The OnClientClick event handler can be used to perform client side validations and to get a confirmation from the user before triggering the server side event handler as follows.

OnClientClick="if(!confirm('Are you sure you want to Save?')) return false;"

Here is a full example

<title>OnClientClick</title>

</head>

<body>

<div>

<asp:Button

id="btnSave"

runat="server"

Text="Client Click"

OnClientClick="if(!confirm('Are you sure you want to Save?'))
return false;"

onclick="btnSave_Click"/>

</div>

</form>

</body>

</html>

Here once the user clicks on the button, a confirmation message 'Are you sure you want to Save?' will get poped up in a message box with, if the user selects Yes then the server side event will be triggered, else the server side event will not be triggered.

Related Post
Asp.Net Button OnClientClick Example
How to: Call JavaScript function on OnClientClick event of Asp.Net button
Asp.Net Button OnClick Vs OnClientClick
Asp.Net Button OnClientClick prevent post back.
Asp.net button OnClientClick Confirm Message

Asp.Net Button OnClientClick prevent post back.

The Asp.Net button has 2 attributes to trigger a click event OnClick and OnClientClick.

OnClientClick – Calls the client side (JavaScript) event handler
OnClick – Calls the server side (code-behind) event handler

The OnClientClick event handler will be executed first, followed by the OnClick event handler.

In some cases we will have to stop calling the server side event after executing the client side event (Ex: When the client side validation fails), this can be achieved by returning false from the client side function which handles the OnClientClick event as follows.

Here is a full example

<title>OnClientClick</title>

function JavascriptFunction() {

// Add validation code here.

// If validation fails

// return false to stop server side event.

return false;

}

</script>

</head>

<body>

<div>

<asp:Button

id="btnSave"

runat="server"

Text="Client Click"

OnClientClick="if(!JavascriptFunction()) return false;"

onclick="btnSave_Click"/>

</div>

</form>

</body>

</html>

Here since the client side JavaScript function returns false, the server side onclick event will not be triggered.

Related Post
Asp.Net Button OnClientClick Example
How to: Call JavaScript function on OnClientClick event of Asp.Net button
Asp.Net Button OnClick Vs OnClientClick
Asp.Net Button OnClientClick prevent post back.
Asp.net button OnClientClick Confirm Message

Asp.Net Button OnClick Vs OnClientClick

The Asp.Net button has 2 attributes to trigger a click event OnClick and OnClientClick.

OnClientClick – Calls the client side (JavaScript) event handler
OnClick – Calls the server side (code-behind) event handler

The OnClientClick event handler will be executed first, followed by the OnClick event handler.

The OnClientClick event handler can be used to perform client side validations before the page is submitted, the OnClick event handler can be used to perform server side operations like saving data to database.

Here is an example using both the events.

<title>OnClientClick</title>

function JavascriptFunction() {

alert("Hi! I am a Javascript Function");

}

</script>

</head>

<body>

<div>

<asp:Button
id="btnSave"

runat="server"

Text="Save"

OnClientClick="JavascriptFunction();"/>

</div>

</form>

</body>

</html>

Here when the user clicks on the button the client side JavaScript function JavascriptFunction() will be called first, following which the server side function btnSave_Click will be executed.

Related Post
Asp.Net Button OnClientClick Example
How to: Call JavaScript function on OnClientClick event of Asp.Net button
Asp.Net Button OnClick Vs OnClientClick
Asp.Net Button OnClientClick prevent post back.
Asp.net button OnClientClick Confirm Message

How to: Call JavaScript function on OnClientClick event of Asp.Net button

The Asp.Net button is a server control and its click event is by default associated with a server side event handler function as follows.

OnClick="btnSave_Click"

But there are situations where we need to perform client side operations by calling a JavaScript function before submitting the page to the server side event handler, this can be achieved by assigning a JavaScript function to the OnClientClick event of the button as follows.

OnClientClick="JavascriptFunction();

Here is a full example

<html xmlns="http://www.w3.org/1999/xhtml" >

<title>OnClientClick</title>

function JavascriptFunction() {

alert("Hi! I am a Javascript Function");

}

</script>

</head>

<body>

<div>

<asp:Button

id="btnSave"

runat="server"

Text="Save"

OnClientClick="JavascriptFunction();"/>

</div>

</form>

</body>

</html>

Here when the user clicks on the button the client side Javascript function JavascriptFunction() will be called first, following which the server side function btnSave_Click will be executed.

Related Post
Asp.Net Button OnClientClick Example
How to: Call JavaScript function on OnClientClick event of Asp.Net button
Asp.Net Button OnClick Vs OnClientClick
Asp.Net Button OnClientClick prevent post back.
Asp.net button OnClientClick Confirm Message

Asp.Net Button OnClientClick Example

The Asp.Net button has 2 attributes to trigger a click event OnClick and OnClientClick.

.aspx page

<title>OnClientClick</title>

function JavascriptFunction() {

alert("Hi! I am a Javascript Function");
}

</script>

</head>

<body>

<div>

<asp:Button

id="btnSave"

runat="server"

Text="Client Click"

OnClientClick="JavascriptFunction();"
onclick="btnSave_Click"/>

</div>

</form>

</body>

</html>

.aspx.cs page (code-behind)

protected void btnSave_Click(object sender, EventArgs e)

{

Response.Write("Hi! I am a Server side (code-behind) Function");

}

Here when the user clicks on the button the client side Javascript function JavascriptFunction() will be called first and an alert message Hi! I am a Javascript Function will popup, once the user clicks ok in the message box the server side function btnSave_Click will be executed and the message Hi! I am a Server side (code-behind) Function will be displayed on the screen.

SharePoint Server 2010 180 days Trial Standard/Enterprise versions can be downloaded from the following location.

C# Guide - C#, Asp.Net, MVC, LINQ, jQuery and SharePoint Resources

Wednesday, August 29, 2012

Asp.net button OnClientClick Confirm Message

Asp.Net Button OnClientClick prevent post back.

Asp.Net Button OnClick Vs OnClientClick

How to: Call JavaScript function on OnClientClick event of Asp.Net button

Asp.Net Button OnClientClick Example

Friday, August 24, 2012

SharePoint Download and Trial Versions

SharePoint Editions

SharePoint Versions

SharePoint 2013 Overview

SharePoint 2010 Overview

SharePoint Overview

SharePoint Server 2010 Standard/Enterprise Trial Download

Blog Archive

About Me