CODEWITHSUNDEEP
asp.netupdatepanelpostbackdisabled-control
Eric Bergman
Eric Bergman

Reputation: 1443

ASP.NET: Button inside a ListView inside an Update Panel causes full Postback

<script type="text/javascript">

    function ClientSideClick(myButton) {
        //make sure the button is not of type "submit" but "button"
        if (myButton.getAttribute('type') == 'button') {
            // disable the button
            myButton.disabled = true;
            //myButton.className = "btn-inactive";
            myButton.value = "Posting...";
        }
        return true;
    }

</script>



<asp:UpdatePanel ID="upComments" runat="server" UpdateMode="Always" >
    <ContentTemplate>

        <asp:ListView ... >

            <asp:Button ID="btnSubPostComment" runat="server" Text="Reply Comment"
                        CommandName="cmdPostSubComment" OnClientClick="ClientSideClick(this)" UseSubmitBehavior="false"

        </asp:ListView>

    </ContentTemplate>
</asp:UpdatePanel>

The Javascript function (ClientSideClick) disables the button when it's processing.

The problem is that when I include OnClientClick="ClientSideClick" UseSubmitBehavior="false" in my button, even though it's inside an Update Panel it causes full postback.

If I remove those two Properties OnClientClic and UseSubmitBehavior the button does not cause full postback. Does anyone know why this happens?

All I wanted to do is disable the button and chagne it's text to prevent multiple submissions.

Upvotes: 1

Views: 1732

Answers (1)

Jonty
Jonty

Reputation: 672

I'm not sure if this is exactly what you're looking for but I usually use this:

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<script type="text/javascript">
var pbControl = null;
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginRequestHandler);
prm.add_endRequest(EndRequestHandler);

function BeginRequestHandler(sender, args) {
    pbControl = args.get_postBackElement();
    pbControl.disabled = true;
}
function EndRequestHandler(sender, args) {
    pbControl.disabled = false;
    pbControl = null;
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
    <ContentTemplate>
        <asp:ListView ... >
            <asp:Button ID="btnSubPostComment" runat="server" Text="Reply Comment" CommandName="cmdPostSubComment" OnClientClick="this.value='Posting...';" />
        </asp:ListView>
    </ContentTemplate>
</asp:UpdatePanel>

The only problem is that if the same button is clicked again after the first async postback then it throws a "Operation is not valid due to the current state of the object" error. This might appear as a javascript exception in the form of a 500 internal server error. After doing some research, I came across:

"Microsoft recently (12-29-2011) released an update to address several serious security vulnerabilities in the .NET Framework. MS11-100 was introduced just recently that handles potential DoS attacks. Unfortunately the fix has also broken page POSTs with very large amounts of posted data (form fields). MS11-100 places a limit of 500 on postback items. The new default max introduced by the recent security update is 1000."

Scott Gu writes about it here: http://weblogs.asp.net/scottgu/archive/2011/12/28/asp-net-security-update-shipping-thursday-dec-29th.aspx

Adding the setting key to the web-config file overcomes this error:

<appSettings>
    <add key="aspnet:MaxHttpCollectionKeys" value="2000" />
</appSettings>

Upvotes: 1

Related Questions