Skip to content Skip to sidebar Skip to footer

Aspnet Webforms Disable Button On Submit

I have a small problem in Webforms. I'm trying to disable the submit button on submit, to prevent double posts. The problem is, that the onclick method in codebehind is not getting

Solution 1:

A more simple solution:

<asp:Button ID="btnFind" runat="server" Text="Find"
    OnClientClick="if(this.alreadClicked == true) {this.disabled = true;
    this.value = 'Wait...';} else {this.alreadClicked = true;}" EnableViewState=false
</asp:Button>

You disable the button anyway and also give the user a feedback "Wait...", but must use EnableViewState=false so the button reset to it's original state when the page refresh.


Solution 2:

Ok.. I found the answer :) The trick is to use Page.GetPostBackEventReference(btn). The method will insert a call to dopostback, and the right events will be fired. The easy solution is to just insert that line after the javascript line that disables the button. Then it'll work, but if you have client side validation, that wont work. (Or, it'll work, but the submit button will be disabled if the user forgot to enter the required information).

Here's the demo from my original question edited to use client validation, and with the disabeling of the submit button on postback:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="WebApplication2._default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-2.0.3.min.js"></script>

    <script>
        $(function () {
            if (typeof ValidatorUpdateDisplay != 'undefined') {
                var originalValidatorUpdateDisplay = ValidatorUpdateDisplay;

                ValidatorUpdateDisplay = function (val) {
                    originalValidatorUpdateDisplay(val);

                    //Bind();
                    if (val.isvalid) {
                        $('#<%=btn.ClientID%>').attr('disabled', 'disabled');
                        <%=Page.GetPostBackEventReference(btn)%>
                    }
                }
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server" />
    <div>
        <asp:TextBox runat="server" ID="txtFirstname" />
        <asp:RequiredFieldValidator runat="server" ControlToValidate="txtFirstname" Display="Dynamic" EnableClientScript="true" ErrorMessage="Please enter your firstname" />
        <br />
        <asp:Literal runat="server" ID="ltrDate" />
        <br />
        <asp:Button runat="server" ID="btn" Text="Hit me!" OnClick="Unnamed_Click" />
    </div>
    </form>
</body>
</html>

Codebehind:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebApplication2
{
    public partial class _default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Unnamed_Click(object sender, EventArgs e)
        {
            Thread.Sleep(1000);
            ltrDate.Text = DateTime.Now.ToString();
        }
    }
}

Post a Comment for "Aspnet Webforms Disable Button On Submit"