Disable Button after click it

Discussion in 'ASP .Net Web Controls' started by Guzman, Jan 5, 2006.

  1. Guzman

    Guzman Guest

    Hi, i want to disable a button after i click it, so the button it is not
    submited twice.
    The thing is that i'm working with the onclik event in the server side, and
    in the server side i disable the button, but sometimes the users click the
    button twice really fast, and i don't want this to happen.
    Does someone know how can i disable the button on the client side??
    Can i Submit button both ' runat=server ' and Disable OnClick ? because i
    been trying this but its not working...

    Thanks for any help!
    Guzman, Jan 5, 2006
    #1
    1. Advertising

  2. There are several work arounds. My own solution is to place 2 buttons on the
    form; one is visible and the other is hidden like this:

    <input id="btnPreSubmit" type="button" value="Submit"
    onclick="SubmitAndDisable();">
    <asp:button id="btnSubmit" Runat="server" CssClass="Hidden"
    CausesValidation="True"></asp:button>

    The hidden class should be defined in your styles section as this:
    ..Hidden
    {
    display:none;
    }

    When the user clicks on the visible button the following javascript executes
    the Click event of the real button and disable the displayed button:

    <script language="javascript">
    function SubmitAndDisable()
    {
    var btn = document.getElementById("btnPreSubmit");
    btn.disabled = true; //this will disable the button that is visible to the
    user
    btn = document.getElementById("btnSubmit");
    btn.click(); //this will execute the real submit button
    }
    </script>

    --
    HTH,
    Phillip Williams
    http://www.societopia.net
    http://www.webswapp.com


    "Guzman" wrote:

    > Hi, i want to disable a button after i click it, so the button it is not
    > submited twice.
    > The thing is that i'm working with the onclik event in the server side, and
    > in the server side i disable the button, but sometimes the users click the
    > button twice really fast, and i don't want this to happen.
    > Does someone know how can i disable the button on the client side??
    > Can i Submit button both ' runat=server ' and Disable OnClick ? because i
    > been trying this but its not working...
    >
    > Thanks for any help!
    >
    Phillip Williams, Jan 5, 2006
    #2
    1. Advertising

  3. How about lock(this) when you enter the method handler (to prevent a second
    fired event can enter the method), then you set a variable that prevents the
    event handler from processing any further events. It's a completely
    different approach, but the end result ought to be the same.

    Regards
    Stephan
    Stephan Steiner, Jan 11, 2006
    #3
  4. How about normal Javascript. You're problem is that a user submits a
    page two times really fast. No server side code will be able to stop
    this. What you need is a button which also renders some javascript to
    disable it when it has been clicked. In HTML it would look something
    like:
    <script type='text/javascript'>
    function DisableAndSubmit(buttonID)
    {
    var btn = document.getElementById(buttonID);
    btn.disabled = disabled; // test this one, I don't know the
    javascript entirely by heart
    __doPostBack(buttonID...) // this line you can obtain using either
    Page.GetPostbackEventReference, or
    Page.ClientScript.GetPostbackEventReference
    }
    </script>
    <input type='button' id='myButton'
    onclick='DisableAndSubmit('myButton')'>


    Grtz,

    Wouter van Vugt
    Trainer - Info Support
    http://blogs.infosupport.com/wouterv
    Wouter van Vugt, Jan 11, 2006
    #4
  5. Hi Stephan,

    I am sorry if I sound a bit rude. But I believe that is a very bad
    idea. This will probably severely hamper your performance, presents the
    possibility
    for deadlocks, and it is what I call a hack, not a fix. Never use the
    lock keyword for anything else but thread synchronisation, or better,
    avoid
    needing it all together if you can. Always examine the problem, not the
    symptom, and trace the problem to its source, apply the fix there, or
    in the future, it will really bite you.

    Still, happy coding!

    Grtz,

    Wouter van Vugt
    Trainer - Info Support
    http://blogs.infosupport.com/wouterv
    Wouter van Vugt, Jan 11, 2006
    #5
  6. Sry for the ugly formatting, I decided to just build it. I think it is
    all ASP.NET 1.1 (built with VStudio 2005...)

    public class SingleClicker : WebControl
    {
    [DefaultValue("")]
    public string Text
    {
    get
    {
    string text = (string)ViewState["Text"];
    if(text == null)
    {
    text = String.Empty;
    }
    return text;
    }
    set { ViewState["Text"] = value; }
    }

    protected override HtmlTextWriterTag TagKey
    {
    get
    {
    return HtmlTextWriterTag.Input;
    }
    }

    protected override void AddAttributesToRender(HtmlTextWriter
    writer)
    {
    writer.AddAttribute(HtmlTextWriterAttribute.Onclick,
    String.Format("DisableButtonAndPostBack('{0}')",
    ClientID));
    writer.AddAttribute(HtmlTextWriterAttribute.Type,
    "button");
    writer.AddAttribute(HtmlTextWriterAttribute.Value,
    Text);
    base.AddAttributesToRender(writer);
    }

    protected override void OnPreRender(EventArgs e)
    {
    if (Page.IsClientScriptBlockRegistered("SingleClicker") ==
    false)
    {
    Page.RegisterClientScriptBlock("SingleClicker",
    @"<script type='text/javascript'>
    function DisableButtonAndPostBack(buttonID)
    {
    var btn = document.getElementById(buttonID);
    btn.disabled = ""disabled"";" +
    Page.GetPostBackEventReference(this) + ";" +
    @"
    }
    </script>");
    }
    base.OnPreRender(e);
    }
    }
    Wouter van Vugt, Jan 11, 2006
    #6
  7. Wouter van Vugt, Jan 11, 2006
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Sinity

    Disable button after first click

    Sinity, Nov 12, 2003, in forum: ASP .Net
    Replies:
    15
    Views:
    15,947
    nayak
    Sep 4, 2007
  2. Sinity

    Disable button after first click

    Sinity, Nov 12, 2003, in forum: ASP .Net
    Replies:
    0
    Views:
    406
    Sinity
    Nov 12, 2003
  3. Chris  Ashley
    Replies:
    1
    Views:
    2,798
    =?Utf-8?B?RGF2aWQgSmVzc2Vl?=
    Dec 16, 2005
  4. GS
    Replies:
    11
    Views:
    39,189
  5. Sinity

    Disable button after first click

    Sinity, Nov 12, 2003, in forum: ASP General
    Replies:
    1
    Views:
    133
    Ray at
    Nov 12, 2003
Loading...

Share This Page