Problem of Page refresh

Last post 12-21-2007, 2:37 PM by xappie. 9 replies.
Sort Posts: Previous Next
  •  12-19-2007, 2:40 PM Post number 41459

    Problem of Page refresh

    Hello Guys,

    I am facing problem of web page refreshing. If I have a Data entry form say Employee master, where user is making data entry and saving it. The moment user hit the save button and before message getting display to show record saved successfully user hits again REFRESH button of browser. Now, records gets added two times.

    How to avoid this page refreshing problem?

    Thanks.

     

     

     

     

     


    Give people what they expect and do it cheerfully.
  •  12-20-2007, 11:03 PM Post number 41512 in reply to post number 41459

    • Damon is not online. Last active: 11-19-2008, 3:15 PM Damon
    • Top 10 Contributor
    • Joined on 06-26-2006
    • Dallas, TX
    • Acorn Archimedes

    Re: Problem of Page refresh

    You basically have 4 options:

    1. Educate the User
      Probably the best option in theory but the worst option in practice.  If you find a way to educate your users so they don't go clicking on things like crazy, let us all know.
    2. Check for Duplicates
      If you get data that's exactly the same as another record, chances are it's a duplicate.  Check for it.  If you don't find it, add the record.  If you do find it, tell the user a duplicate record exits and chastise them for hitting the button over and over again.
    3. Disable the Button
      You cannot click twice that which is disabled after clicking once.  You think this would be easy, but if you put OnClientClick="this.disable = true" in your button tag, guess what?  That's right, the button gets disabled before the form posts back.  There are more creative ways to solve it -- I will post it on my blog here shortly.
    4. Employe "Car Wash Tokens"
      Google-it.  MSN-it.  Yahoo-it.  I can't do it justice here.  Basically, it's a methodology that ensures a previous request is not processed by issuing a per-request token.  In essence

      - Server generates a token -- which we will call token 1
      - User gets page with token 1
      - User submits page with token 1
      - Server runs page request and checks token
      - Server sees token 1 has NOT been used, so page processes
      - Before server responds, user re-submits page, re-sending token 1
      - Server runs page request and checks token
      - Server sees token 1 has already been processed -- denies page request

      If you plan on using this, you need a way to issue and mark tokens as used. 

    Hope that helps!


    Damon Armstrong, Technology Consultant
    [Blog] [Articles]
  •  12-21-2007, 12:07 AM Post number 41516 in reply to post number 41512

    • Damon is not online. Last active: 11-19-2008, 3:15 PM Damon
    • Top 10 Contributor
    • Joined on 06-26-2006
    • Dallas, TX
    • Acorn Archimedes

    Re: Problem of Page refresh

    Give this a shot: Disabling an ASP.NET Button when Clicked


    Damon Armstrong, Technology Consultant
    [Blog] [Articles]
  •  12-21-2007, 10:53 AM Post number 41541 in reply to post number 41516

    Re: Problem of Page refresh

    Ok, I tried your suggested code and it's not working for me.  The initial click comes back to the server and causes the entire page to be redrawn as expected.  This of course means that the custom event handlers setup by the javascript are now gone.

    Here is my code in case im am doing something wrong....

    <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="PhilTest.WebForm1" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>Untitled Page</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
       
        <script type="text/javascript" language="javascript">
        function disableButton(button, resetDelay)
        {
            button.oldonclick = button.onclick;
            button.onclick=noClick; //new Function("return false;");
            setTimeout("enableButton('"+ button.id + "');", resetDelay);                                   
        }
        function noClick()
        {
            alert("Chill - You already submitted this page once. Submitting it twice isn't going to make the server go faster.  Quit hitting the freakin' button!");
            return false;
        }
        function enableButton(buttonId)
        {
            var button = document.getElementById(buttonId);
            if(button!=null)
            {
                button.onclick = button.oldonclick;
            }
        }
    </script>
       
        <asp:Button ID="Button1" runat="server" Text="My Button" OnClientClick="disableButton(this,30000)" />
       
        </div>
        </form>
    </body>
    </html>

  •  12-21-2007, 11:06 AM Post number 41542 in reply to post number 41541

    • Damon is not online. Last active: 11-19-2008, 3:15 PM Damon
    • Top 10 Contributor
    • Joined on 06-26-2006
    • Dallas, TX
    • Acorn Archimedes

    Re: Problem of Page refresh

    xappie:
    ... This of course means that the custom event handlers setup by the javascript are now gone ...

    I just pasted the markup you posted back into Visual Studio, ran it, and everything looks like it's working just fine.  What are these custom event handlers being setup in JavaScript of which you speak?


    Damon Armstrong, Technology Consultant
    [Blog] [Articles]
  •  12-21-2007, 11:09 AM Post number 41543 in reply to post number 41542

    Re: Problem of Page refresh

    Im just referring to this line when i say eventhandlers
       button.onclick=noClick;

    When I run it, I cant get the alert msgbox to show up when i double click and the button never gets disabled.


  •  12-21-2007, 11:24 AM Post number 41545 in reply to post number 41543

    • Damon is not online. Last active: 11-19-2008, 3:15 PM Damon
    • Top 10 Contributor
    • Joined on 06-26-2006
    • Dallas, TX
    • Acorn Archimedes

    Re: Problem of Page refresh

    When you say double click, what is the sequence of events to which you are referring?  The solution I posted solves the problem:

    1.) User Clicks the Button - page posts
    2.) User Clicks the Button again before the server responds - message displays indicating that the button is disabled
    3.) Page Redraws -- at this point the user can click the button again because the page has processed

    Is that the issue?  Or are you trying to keep them from

    1.) User clicks button - record adds
    2.) Page Redraws
    3.) User clicks button - duplicate record adds

     


    Damon Armstrong, Technology Consultant
    [Blog] [Articles]
  •  12-21-2007, 11:26 AM Post number 41546 in reply to post number 41545

    Re: Problem of Page refresh

    Your first scenario is what I am trying to duplicate.
    Im guess that the situation is just that my server side code for the button click is just too quick (at least in dev environment) and so I cant double click the button fast enough to see the javascript alert.


  •  12-21-2007, 11:41 AM Post number 41547 in reply to post number 41546

    • Damon is not online. Last active: 11-19-2008, 3:15 PM Damon
    • Top 10 Contributor
    • Joined on 06-26-2006
    • Dallas, TX
    • Acorn Archimedes

    Re: Problem of Page refresh

    Ah.  I had the same issue in dev too, I just put a breakpoint on my code so the page would hang until I let it continue, giving me time to ensure the button would display the message.  If you really want to see it work without a breakpoint, try this:

    <%Page Language="VB"AutoEventWireup="false"CodeFile="Default.aspx.vb"Inherits="_Default"%>
    
    <
    html xmlns="http://www.w3.org/1999/xhtml"
    <head runat="server"
        
    <title>Disable Test</title>
        <
    script type="text/javascript"
            
    FUNCTION disableButton(buttonresetDelay)
            
    {
                button.oldonclick 
    button.onclick;
                
    button.onclick=noClick; //new FUNCTION("return false;";
                
    setTimeout("enableButton('" button.id "');" resetDelay);                                    
            
    }
            
    FUNCTION noClick()
            
    {
                alert
    ("Chill - You already submitted this page once. Submitting it twice isn't going to make the server go faster.  Quit hitting the freakin' button!";
                
    RETURN false;
            
    }
            
    FUNCTION enableButton(buttonId)
            
    {
                var button 
    document.getElementById(buttonId);
                
    IF(button!=NULL)
                
    {
                    button.onclick 
    button.oldonclick;
                
    }
            }
        
    </script>
    </
    head>
    <
    body>
        <
    form id="form1"runat="server"
            
    <asp:Button runat="server"ID="mybutton"TEXT="Click Me"OnClientClick="disableButton(this,5000);"/>
            <
    asp:Label runat="server"ID="myLabel"/>
        </
    form>
    </
    body>
    </
    html>
    and this for the code behind:
    Partial Class _Default
    
        Inherits System.Web.UI.Page

        Protected 
    Sub mybutton_Click(ByVal sender As ObjectByVal As System.EventArgsHandles mybutton.Click
            System.Threading.Thread.Sleep
    (5000)

            
    Dim counter As Integer

            If 
    ViewState("TEST"Is Nothing Then
                
    counter 0
            
    Else
                
    counter DirectCast(ViewState("TEST"), Integer)
            
    End If

            
    counter +1

            myLabel.Text 
    counter.ToString()

            
    ViewState("TEST"counter

        
    End Sub

    End 
    Class

    This displays the click count in a label, but the button code forces the thread to sleep 5 seconds before processing, which makes your page "hang" for a few seconds so you can test out the button functionality.  Just remember if you put a sleep call in your actual code -- take it out before you deploy it to production =]
    Damon Armstrong, Technology Consultant
    [Blog] [Articles]
  •  12-21-2007, 2:37 PM Post number 41552 in reply to post number 41547

    Re: Problem of Page refresh

    Thanks for your help. Works perfectly. :)
View as RSS news feed in XML