MS AJAX : Update Panel only postback once

Recently, I was assigned to migrate Magic Ajax to MS Ajax. I found out that MS Ajax doesn’t support the following code that tied to the onSubmit attribute on the server form:

ServerForm.Attributes.Add("onSubmit", "if (this.submitted) return false; this.submitted = true; return true");

Basically, this javascript used to prevent Users from Submitting a Form Twice. Indirectly, it only allow asp:UpdatePanel to post back once. The subsequent post back is blocked.

The workaround is remove the attached javascript and it will works fine. However, it break the rule on preventing multiple form submision.

I proposed two better approaches to replace the workaround.

1. Disabling a Button When Clicked (by 4guysfromrolla.com)

Many websites prevent a user from submitting a form more than once by disabling the submit button upon being clicked. Along with disabling the submit button, sites typically change the button’s text from its initial value (such as "Submit") to some other value indicating than action has taken place (like "Submitted"). Changing the text and disabling the button can be accomplished using a couple lines of JavaScript in the button’s client-side onclick event handler:

 Here is the live demo.

2. "Freezing" the Page On Form Submission (by 4guysfromrolla.com)

Nowadays, many websites freeze the screen when the form is submitted. It is  to prevent double form submissions. Specifically, the screen is frozen by placing a full screen, absolutely positioned element above all other elements on the page (specifically a <div> element). This covers up the content beneath the element and prevents the user from interacting with the form elements.

This technique is very common for Rich application development especially Ajax-support websites. Once you freeze up the page, you can do a lot of background processing in the  asynchronization way.

 Here is the live demo.

Tagged Under ( )

Leave a Reply