locked
How to Close Modal popup from another page which is inside an iframe RRS feed

  • Question

  • User-888794427 posted

    Hello Everyone,

    I have a Main Page, A. It has a modal pop up extender and an panel. Inside Panel is an iframe whose source is an another page B. Page B has user controls which is set visible /invisible based on some conditions.

    Page A has a grid. When I click on edit in the grid. it opens the modal pop up, which loads an iframe and makes the user control visible. User controls has an save button. On Click of which i should save the data and close my modal pop. Please let me know how to achieve this.?

    I am unable to get the Id of the modal pop up extender from the user control to hide it.

    Any help is very much appreciated.

     

     

     

     

     

    Friday, March 14, 2014 8:28 AM

Answers

  • User-933407369 posted

    hi,

    According to your description, i would suggest you try using the codes with javascript:

       $find('ModalPopupBehavior').hide();

    you can also open or close ModalPopupExtender in client side using javascript.

    http://www.aspsnippets.com/Articles/ShowHide-OpenClose-AJAX-Modal-Popup-using-JavaScript-in-ASPNet.aspx

    calling ModalPopupExtender from another page

    http://forums.asp.net/p/1336894/2696081.aspx

    http://www.aspforums.net/Threads/164669/Close-ModalPopupExtender-and-Redirect-to-another-Page-in-ASPNet/Answered

    Hope this helps, thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, March 17, 2014 5:29 AM
  • User1208776063 posted

    User controls has an save button. On Click of which i should save the data and close my modal pop. Please let me know how to achieve this.?

    Firstly, you would have to create a function to hide the modal popup in the page that contains grid. You need to set BehaviorId for the modal popup Extender

    <script>
        function hideEditModalPopup() {
            $find("editModalPopupBehaviorId").hide();
            return false;
        }
    </script>

    Now, you have to create a JavaScript function in the iframe source page to invoke parent window hideEditModalPopup function once save operation is complete

    <script type="text/javascript">
        function callParentWindowHideMethod() {
            if (window.parent.hideEditModalPopup) {
                window.parent.hideEditModalPopup();
            }
        }
    </script>

    You can invoke this JavaScript function from Save button click event handler as

    protected void btnSave_Click(object sender, EventArgs e)
    {
        //save data here
        //if using Update Panel
        ScriptManager.RegisterStartupScript(thisthis.GetType(), "hidePopup""callParentWindowHideMethod();"true);
        /**********if not using Update Panel *************/
        //Page.ClientScript.RegisterStartupScript(this.GetType(), "hidePopup", "callParentWindowHideMethod();", true);
    }
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, March 18, 2014 12:39 AM

All replies

  • User-512825052 posted

    Be more clear on your problem. If your are trying to edit the backend details of a grid row through a popop. it is simple. Just put the controls on the panel of the popup. If it is your target let me know. 

    Friday, March 14, 2014 10:29 AM
  • User-888794427 posted

    problem is:

    I am using a panel in my main page. Inside Panel, there is an iframe, whose src is another aspx. This aspx has multiple user controls. And each user control as a save button. now, all these are displayed inside a modal pop up. Now, when i click on save button of a user control, the modal pop up should be closed. 

    How do i get reference to the modal pop up extender from the user control to hide it.?

    Monday, March 17, 2014 3:38 AM
  • User-933407369 posted

    hi,

    According to your description, i would suggest you try using the codes with javascript:

       $find('ModalPopupBehavior').hide();

    you can also open or close ModalPopupExtender in client side using javascript.

    http://www.aspsnippets.com/Articles/ShowHide-OpenClose-AJAX-Modal-Popup-using-JavaScript-in-ASPNet.aspx

    calling ModalPopupExtender from another page

    http://forums.asp.net/p/1336894/2696081.aspx

    http://www.aspforums.net/Threads/164669/Close-ModalPopupExtender-and-Redirect-to-another-Page-in-ASPNet/Answered

    Hope this helps, thanks.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, March 17, 2014 5:29 AM
  • User1208776063 posted

    User controls has an save button. On Click of which i should save the data and close my modal pop. Please let me know how to achieve this.?

    Firstly, you would have to create a function to hide the modal popup in the page that contains grid. You need to set BehaviorId for the modal popup Extender

    <script>
        function hideEditModalPopup() {
            $find("editModalPopupBehaviorId").hide();
            return false;
        }
    </script>

    Now, you have to create a JavaScript function in the iframe source page to invoke parent window hideEditModalPopup function once save operation is complete

    <script type="text/javascript">
        function callParentWindowHideMethod() {
            if (window.parent.hideEditModalPopup) {
                window.parent.hideEditModalPopup();
            }
        }
    </script>

    You can invoke this JavaScript function from Save button click event handler as

    protected void btnSave_Click(object sender, EventArgs e)
    {
        //save data here
        //if using Update Panel
        ScriptManager.RegisterStartupScript(thisthis.GetType(), "hidePopup""callParentWindowHideMethod();"true);
        /**********if not using Update Panel *************/
        //Page.ClientScript.RegisterStartupScript(this.GetType(), "hidePopup", "callParentWindowHideMethod();", true);
    }
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, March 18, 2014 12:39 AM