CODEWITHSUNDEEP
javascriptjqueryhtml
Ron
Ron

Reputation: 1931

jQuery dialog modal opens every time on pageload during click event

I am using jQuery's Modal dialog popup on page-load to display a message, and upon closing the modal, i am displaying my page, with couple of buttons on the page.

When I click on any of those buttons, the modal dialog opens up, and it opens on any click_event on the page. I am not sure how to deactivate the modal dialog on every click_event of the same page.

<script>
    $(document).ready(function () {
        $("#dialog-confirm").dialog({
            resizable: false,
            height: 189,
            width: 500,
            modal: true,
            buttons: {
               Agree: function () {
                    $(this).dialog("close");
                }
            }
        });
    });
 </script>

and my html is :

<div id="dialog-confirm" title="PLEASE READ BEFORE PROCEDDING" 
        style="font-weight: bold">
     <p>Documentation is MANDATORY!</p>
     <p>Please remember to list the PCP and Radiology Services Visited with the 
           and TIME included.  Please select “Agree” to continue.
     </p>
</div>

I searched this forum for similar issues, but haven't found any solution for this issue.

Any help is appreciated.

Upvotes: 0

Views: 909

Answers (2)

Gjohn
Gjohn

Reputation: 1281

Try the following:

Change your javascript to the following:

<script>
$(document).ready(function () {
    confimationDialogShow: function() {
    $("#dialog-confirm").dialog({
        resizable: false,
        height: 189,
        width: 500,
        modal: true,
        buttons: {
           Agree: function () {
                $(this).dialog("close");
            }
        }
    });
    }
});
</script>

On your server do the following in your Page_Load method:

if (!Page.IsPostBack)
{
  ScriptManager.RegisterStartupScript(this,this.GetType(), "Javascript", "javascript: confimationDialogShow();", true);
}

So every time you load the page for the very first time you can fire the startup script and show the dialog. Subsequent postbox from the page will not show the dialog anymore. because the script to call it will only get launched when the IsPostBack value is false.

Happy Coding!!!

UPDATE

Hey Ron, let's try and take this out of the $(document).ready(). Do this instead.

<script>
   function confirmationDialogShow() {
        $("#dialog-confirm").dialog({
           resizable: false,
           height: 189,
           width: 500,
           modal: true,
           buttons: {
              Agree: function () {
                 $(this).dialog("close");
              }
           }
        });
   }
</script>

See if the Register script will call it now. BTW - your dialog isn't in an asp:UpdatePanel like that?

Upvotes: 1

low_rents
low_rents

Reputation: 4481

since your html code of the page with buttons is missing, i am just guessing.
put Agree into quotation marks, like it's done in this example.

   buttons: {
               "Agree": function () {
                    $(this).dialog("close");
                }
            }

otherwise your function may apply to all buttons on your page.

Upvotes: 0

Related Questions