locked
Using Modal Popup Extender, Disable Button in Modal Popup not disabling the button RRS feed

  • Question

  • User-1501195479 posted

    I've got a button inside a modal popup (using the Modal Popup Extender).  I've used late-binding to attach the server event to the button and set the UseSubmitBehavior="false" in the button.

    <asp:Panel runat="server" ID="pnlConfirm" Width="450px" CssClass="popupPanel" style="padding-top: 15px; padding-bottom: 15px;">

    <asp:Panel runat="server" ID="plcWait" style="display: none; padding-top: 15px; padding-bottom: 15px;">
    <div class="label" style="padding-top: 20px; padding-bottom: 20px; text-align: center; width: 100%; margin-left: auto; margin-rigth: auto;">
    Please wait while we process your request.
    <br />
    <br />
    <asp:Image runat="server" ID="Image2" ImageUrl="~/images/processing.gif" />
    </div>
    </asp:Panel>

    <asp:Panel runat="server" ID="plcConfirm" style="display: block;">
    <div>
    <div style="padding-bottom: 15px; padding-top: 15px; padding-left: 10px; padding-right: 10px;">
    Are you sure?
    </div>
    <div style="text-align: center; margin-left: auto; margin-right: auto; padding-bottom: 5px; padding-left: 10px; padding-right: 10px;">
    <asp:Button runat="server" ID="btnConfirmYes" Width="70px" CssClass="button" Text="Yes" UseSubmitBehavior="false" />
    &nbsp;&nbsp;
    <asp:Button runat="server" ID="btnConfirmNo" Width="70px" CssClass="button" Text="No" UseSubmitBehavior="false" />
    </div>
    </div>
    </asp:Panel>

    </asp:Panel>

    <asp:Button runat="server" ID="btnTarget" Text="Go"/>
    <asp:ModalPopupExtender id="mpeConfirm"
    BackgroundCssClass="modalBackground"
    popupcontrolid="pnlConfirm"
    targetcontrolid="btnTarget"
    runat="server" ></asp:ModalPopupExtender>

    When the user clicks the button, I want to disable the button - client-side - to prevent them from clicking the button again - until after the server events have completed.  I also added code which will hide the current panel and show another panel - one with a message to wait for the process to finsih.  I've done this all over the place in Web Forms and it's worked find but it doesn't work in the modal popup.

    Here is some of the code in the code behind:

    protected override void OnInit(EventArgs e)
    {

    btnConfirmYes.Attributes.Add("onclick", "javascript:document.getElementById('" +
    btnConfirmYes.ClientID + "').disabled=true; document.getElementById('" + plcConfirm.ClientID + "').style.display = 'none'; document.getElementById('" + plcWait.ClientID + "').style.display = 'block';");

    this.btnConfirmYes.Click +=
    new System.EventHandler(btnConfirmYes_Click);

    }

    Friday, January 3, 2014 11:18 AM

Answers