SP.UI.ModalDialog Close button

Question

I have created a visual webpart in SP2013. and created a page and add that WebPart to the page http://server Name/Pages/survey.aspx

to make this WebPart to show as a popup on the homepage every time page loads, I have added the below script (PupopSurvey.js) to Site Assets then added a Content Editor Webpart to the Home Page with the link to /SiteAssets/PupopSurvey.js.

 <script type="text/ecmascript">
var str = document.cookie.substring(0, 8);
 alert("Cookie= "+ str);
if ( (str == "Canceled!") || (str == "PostBack") ) { 
 alert(str);
}

ExecuteOrDelayUntilScriptLoaded(ShowDialog, "sp.js");


function ShowDialog() {

        var options = {

            url: 'http://ServerName/Pages/survey.aspx',
            dialogReturnValueCallback:CloseCallback,            
            height: 900,
            width:800

        }; 

        SP.UI.ModalDialog.showModalDialog(options);

        }
function CloseCallback(result, target) {

     if(result==SP.UI.DialogResult.OK) {

       window.location.href='http://ServerName/Pages/survey.aspx';
       }

        if(result==SP.UI.DialogResult.cancel){   

          SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel,'cancel Clicked');
          document.cookie="Canceled!";
          alert(document.cookie);
          }      

    }

</script>

When the home page loads, the survey.aspx page comes up as a pop up. but I have a close button on the survey WebPart which needs to close the popup.

The Close button is :

 <button type="button" OnClick="ClosePopup()" >Close</button>

and Here is the script:

    <script>
      function ClosePopup() {
          alert("Close?");
          document.cookie = "PostBack";
          SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.Cancel, null);
         // SP.UI.ModalDialog.close(dialogResult);

        //  self.close();

  </script>

As you see I tried self.close(); and SP.UI.ModalDialog.close(dialogResult); not working.

Please advise.

Thanks

Answer 1

It is just fixed when I used the below JavaScript to close the popup

 <script> 
    function ClosePopup() {
              document.cookie = "Saved";
              window.frameElement.cancelPopUp();
          }
</script>

and the button is

 <asp:Button ID="Submit" runat="server" CSSClass="Btn" Text="Submit" OnClick="Submit_Click" OnClientClick="SavedInlist()"  />

It is working fine now.

Also I realized SharePoint 2013: ExecuteOrDelayUntilScriptLoaded not executing after page publish, To make sure the SharePoint script file 'sp.js' is loaded before my function runs. I changed

ExecuteOrDelayUntilScriptLoaded(ShowDialog, "sp.js");

To

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', ShowDialog);

Now it is running when page is published.