asp.net form submitted twice

Question

I have a web page with a form and a submit button, and in the server side I used a session value to prevent the form submit twice, which is like the initial value of the session is 0 and turn it to 1 after user click submit button, every time submit button will check the session value first.

But, when our project published, I found there were two records for the same person (which means they submit twice I guess, and it didn't happen very often maybe on one or two persons), and the time interval between these two records is very small, like 0.3 second, so first I thought they might double click the submit button, but after I tried on my computer, it still only insert one record into the database

I am confused how does this happen, and how to prevent it?

Here is the code:

        protected void Page_Init(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            Session["IsBackForwordPayment"] = 0;
        }
    }

    protected void submit_Click(object sender, EventArgs e)
    {

       if (Session["IsBackForwordPayment"] != null && Session["IsBackForwordPayment"].ToString() != "0")
            Response.Redirect("~/pages/renewal/duplicaterenewal.aspx");

.......
}

Is it possible because that after checking the session value the program just redirect to another page but not terminate the submit process ??

Canvas

Do you have ImageButton in your page? #1498769 – Outvote

Response.Redirect("string") automatically calls Response.End() so the execution should be stopping. Are you sure it's not multiple clicks? Any Javascript on the page doing form.submit? Also... is it inside an UpdatePanel (AJAX)? Or just standard Webforms? – Epidote

@Epidote I tried multiple clicks, everything is ok though, and it is standard webform – Canvas

Answer 1

Try

Response.Redirect("~/pages/renewal/duplicaterenewal.aspx", true);

This will stop execution on the current Page.

Ress

actually, I don't how to make sure this is the solution, I tried to return the error but it always works fine on my computer, I have no idea what the user did to make this happen – Canvas

Okay, well currently the Response.Redirect code will run but any subsequent code will also run until the next Page is loaded. Is there any code after Response.Redirect which could produce the conditions you saw in the User's case. – Ress

Answer 2

Apparently Response.End() will NOT stop the execution of the code (which is what it says it does). I discovered this here:

Response.Redirect not ending execution

You will need to add a return statement to end the execution after you do Response.Redirect().

Epidote

Answer 3

This can happen with a double click.

When the connection is slow, the page can hang and allow the user to make two idential submits.

If this is a double click issue, you may be able to test it using Google Chrome's DevTools, under the Network Tab. Change "No throttling" to "Slow 3G"

I was able to duplicate my issue in a testing environment with some inconsistency, which is why I advise just going for the fix.

---

THE FIX:

HIDE THE BUTTON! But not totally. Show a fake button after the click.

Use a visible real button, and a hidden mock button, then hide one and show the other on the button click using JavaScript.

<button id="realbutton" type="submit"  name="Action" value="DoSomething" class="buttonstyle"> 
    Do Something
</button>

<div id="mockbutton" style="cursor: not-allowed; opacity: .5; display:none;" class="buttonstyle"> 
    Do Something
</div>

Note: style="cursor: not-allowed will change the mouse cursor to the red circle with a line through it (to indicate the button is not clickable). And make sure to use the same styling on the div as the button so it will look the same.

At the bottom of the page, include this JavaScript to switch which one is shown.

<script type="text/javascript">

  const myButton = document.querySelector('#realbutton');
  myButton.addEventListener('click', myFunction);

  function myFunction() {
    document.getElementById("realbutton").style.display = "none";
    document.getElementById("mockbutton").style.display = "block";
    // optionally you can show a modal indicating what is going on. 
    // show modal here.
  }
</script>

---

RESULT

Before click:

After click:

While the testing with Google Chrome DevTools, it wasn't conclusive that slow connections allowed double clicks, but when I implemented this measure on my website, our double submit issues went away.

Deuterium