Button.OnClientClick Property (System.Web.UI.WebControls)

OnClientClick Property

Collapse All

Language Filter

This page is specific to

Microsoft Visual Studio 2008/.NET Framework 3.5

Other versions are also available for the following:

.NET Framework Class Library

Button..::.OnClientClick Property

Gets or sets the client-side script that executes when a Button control's Click event is raised.

Namespace: System.Web.UI.WebControls
Assembly: System.Web (in System.Web.dll)

Syntax

Visual Basic (Declaration)

<ThemeableAttribute(False)> _
Public Overridable Property OnClientClick As String

Visual Basic (Usage)

Dim instance As Button
Dim value As String

value = instance.OnClientClick

instance.OnClientClick = value

[ThemeableAttribute(false)]
public virtual string OnClientClick { get; set; }

Visual C++

[ThemeableAttribute(false)]
public:
virtual property String^ OnClientClick {
    String^ get ();
    void set (String^ value);
}

JScript

public function get OnClientClick () : String
public function set OnClientClick (value : String)

ASP.NET

<asp:Button OnClientClick="String" />

Property Value

Type: System..::.String
The client-side script that executes when a Button control's Click event is raised.

Remarks

Use the OnClientClick property to specify additional client-side script that executes when a Button control's Click event is raised. The script that you specify for this property is rendered in the Button control's OnClick attribute in addition to the control's predefined client-side script.

This property cannot be set by themes or style sheet themes. For more information, see ThemeableAttribute and ASP.NET Themes and Skins Overview.

Examples

The following code example demonstrates how to use the OnClientClick property to specify additional client-side script that executes when a Button control is clicked.

Visual Basic

<%@ page language="VB"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
    Label1.Text = "Thank you for visiting our site."
  End Sub

</script>
<html >
<head id="head1" runat="server">
    <title>Button.OnClientClick Example</title>
</head>
<body>
  <form id="form1" runat="server">

    <h3>Button.OnClientClick Example</h3> 


      <h4>Click to navigate to Microsoft.com:</h4>     

      <asp:button id="Button1"
       usesubmitbehavior="true"
       text="Open Web site"
       onclientclick="Navigate()"
       runat="server" onclick="Button1_Click" />

       <p></p>
      <asp:label id="Label1"
        runat="server">
      </asp:label>

    </form>

    <script type="text/javascript">
      function Navigate()
      {
        javascript:window.open("http://www.microsoft.com");
      }    

    </script>
</body>
</html>

<%@ page language="C#"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

void Button1_Click (object sender, EventArgs e)
  {
    Label1.Text = "Thank you for visiting our site.";

  }

</script>
<html >
<head id="head1" runat="server">
    <title>Button.OnClientClick Example</title>
</head>
<body>
  <form id="form1" runat="server">

    <h3>Button.OnClientClick Example</h3> 


      <h4>Click to navigate to Microsoft.com:</h4>     

      <asp:button id="Button1"
       usesubmitbehavior="true"
       text="Open Web site"
       onclientclick="Navigate()"
       runat="server" onclick="Button1_Click" />

       <p></p>
      <asp:label id="Label1"
        runat="server">
      </asp:label>

    </form>

    <script type="text/javascript">
      function Navigate()
      {
        javascript:window.open("http://www.microsoft.com");
      }    

    </script>
</body>
</html>

Platforms

Windows 7, Windows Vista, Windows XP SP2, Windows XP Media Center Edition, Windows XP Professional x64 Edition, Windows XP Starter Edition, Windows Server 2008 R2, Windows Server 2008, Windows Server 2003, Windows Server 2000 SP4, Windows Millennium Edition, Windows 98

The .NET Framework and .NET Compact Framework do not support all versions of every platform. For a list of the supported versions, see .NET Framework System Requirements.

Version Information

.NET Framework

Supported in: 3.5, 3.0, 2.0

Reference

Button Class

Button Members

System.Web.UI.WebControls Namespace

Click

Other Resources

Button Web Server Controls Overview

Tags

: Add a tag

Community Content

Add new content

Annotations

Be Aware of MS Crippling

Perley | Edit | Show History

Please be aware that the lack of common sense at MS has made it so that if you disable the button on the server then the onclick attribute is not even rendered to the client and you must work around this problem or have a post back just to get your script event rendered. Please MS hire a few engineer who have a best practice of common sense.

Tags

: Add a tag

Flag as ContentBug

Preventing postback with OnClientClick

Joe-F ... d9k | Edit | Show History

It's been questoned and blogged about on the web quite a bit, but for those looking here for the first time...

If you want to prevent the ASP.NET button from causing a postback, then have the Javascript function return false and set your on OnClientClick attribute as follows:

<asp:button ... onclientclick=" return Foo()" />

Javascript function:

function Foo()
{
alert('Hello world');

// It's the return false that prevents the postback, if you return true the postback will occur
return false;
}

******************************************************************************
This is not true. If you replace "alert('Hello world');" with "button.disabled=true;" no postback will occur, regardless of the return value.

Tags

: onclientclick (x) postback (x) prevent (x) Add a tag

Flag as ContentBug

"Be Aware of MS Crippling" --> extra step needed see below

tanging | Edit | Show History

in the javascript, you could do a WCF call and handle it all that way, completely prevents the postback and you can do anything within the DOM.


for the postback, obviously:
to have the button operate with a this.disabled=true, add an additional asp:button tag: UseSubmitBehavior="false"

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.usesubmitbehavior.aspx
http://www.codeproject.com/KB/ajax/disable_btn_on_click.aspx

Tags

: Add a tag

Flag as ContentBug