locked
update progress for ajax modal popup called from server side RRS feed

  • Question

  • User641655154 posted

    Im trying to call ajax modal pop up from  code behide file in c#. my modal popup contain  a message and two buttons Yes /no . and have to execute some function inside the yes button in server side. I wnt to use update progress while system executing the server side function of yes button click event. How to do that.... 

    I already have a update progress along with page that will dispaly for all control in this page. but when i used the below pannel4 associated with modal popup..   its events ( yes button click) not displaying any updates..

    <asp:Button ID="Button5" runat="server" Text="Button" CausesValidation="False" Style="display: none" />

    <!-- ModalPopupExtender -->
    <cc1:ModalPopupExtender ID="mp1" runat="server" PopupControlID="Panel4" TargetControlID="Button5"
    CancelControlID="btnmsgCancel" BackgroundCssClass="modalBackground">
    </cc1:ModalPopupExtender>

    <asp:Panel ID="Panel4" runat="server" CssClass="modalPopup2" align="center" >
    <table style ="width: 100% ; height :100%;">
    <tr>
    <td colspan = "3" align ="center" style =" height :60%;">
    <asp:Label ID="lblmsg" runat="server" Text=""></asp:Label>
    </td>
    </tr>
    <tr>
    <td colspan= "3" style =" width:2px;">
    <hr/>
    </td>
    </tr>
    <tr>
    <td align ="right">
    <asp:Button ID="btnmsgOk" runat="server" CssClass="btn" Width="60px" Text="Ok" OnClick ="btnmsgOk_Click"/>
    </td>
    <td style =" width :50px;">
    </td>
    <td align ="left">
    <asp:Button ID="btnmsgCancel" runat="server" CssClass="btn" Width="60px" Text="Cancel" />
    </td>
    </tr>
    </table>
    </asp:Panel>

    protected void btnmsgOk_Click(object sender, EventArgs e)

    {

    // some functions here

    //while executingg themm update progress has to work..

    }

    Thursday, October 30, 2014 10:18 AM

Answers

  • User61956409 posted

    Hi dson,

    Thanks for your post.

    I already have a update progress along with page that will dispaly for all control in this page. but when i used the below pannel4 associated with modal popup..   its events ( yes button click) not displaying any updates..

    As for your problem, you could refer to the below sample.

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
            <div>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <asp:Button ID="btnmsgOk" runat="server" Text="OK" OnClick="btnmsgOk_Click" />
                        <asp:Panel ID="Panel1" runat="server" align="center">
                            <asp:Label ID="Label1" runat="server" Text="Update in progress..."></asp:Label>
                            <br />
                            <asp:Button ID="btnClose" runat="server" Text="Close" />
                        </asp:Panel>
    
                        <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                            <ProgressTemplate>
                            </ProgressTemplate>
                        </asp:UpdateProgress>
                        <asp:ModalPopupExtender ID="UpdateProgress1_ModalPopupExtender" runat="server" Enabled="True" TargetControlID="UpdateProgress1" PopupControlID="Panel1">
                        </asp:ModalPopupExtender>
                    </ContentTemplate>
                </asp:UpdatePanel>
    
            </div>
    
            <script>
                Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(showpop);
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(hidepop);
    
                function showpop(sender, args) {
                    $find('<%= UpdateProgress1_ModalPopupExtender.ClientID%>').show();
                }
    
                function hidepop(sender, args) {
                    $find('<%= UpdateProgress1_ModalPopupExtender.ClientID%>').hide();
                }
            </script>
        </form>
    </body>
    </html>  
    

    Besides, you could refer to the example in this link.

    Hope it will be helpful to you.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 31, 2014 1:43 AM
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, November 3, 2014 11:15 PM

All replies

  • User61956409 posted

    Hi dson,

    Thanks for your post.

    I already have a update progress along with page that will dispaly for all control in this page. but when i used the below pannel4 associated with modal popup..   its events ( yes button click) not displaying any updates..

    As for your problem, you could refer to the below sample.

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
            <div>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                    <ContentTemplate>
                        <asp:Button ID="btnmsgOk" runat="server" Text="OK" OnClick="btnmsgOk_Click" />
                        <asp:Panel ID="Panel1" runat="server" align="center">
                            <asp:Label ID="Label1" runat="server" Text="Update in progress..."></asp:Label>
                            <br />
                            <asp:Button ID="btnClose" runat="server" Text="Close" />
                        </asp:Panel>
    
                        <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                            <ProgressTemplate>
                            </ProgressTemplate>
                        </asp:UpdateProgress>
                        <asp:ModalPopupExtender ID="UpdateProgress1_ModalPopupExtender" runat="server" Enabled="True" TargetControlID="UpdateProgress1" PopupControlID="Panel1">
                        </asp:ModalPopupExtender>
                    </ContentTemplate>
                </asp:UpdatePanel>
    
            </div>
    
            <script>
                Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(showpop);
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(hidepop);
    
                function showpop(sender, args) {
                    $find('<%= UpdateProgress1_ModalPopupExtender.ClientID%>').show();
                }
    
                function hidepop(sender, args) {
                    $find('<%= UpdateProgress1_ModalPopupExtender.ClientID%>').hide();
                }
            </script>
        </form>
    </body>
    </html>  
    

    Besides, you could refer to the example in this link.

    Hope it will be helpful to you.

    Best Regards,

    Fei Han

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 31, 2014 1:43 AM
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, November 3, 2014 11:15 PM