I have a modal Dialog Box confirmation and it works fine if I click Ok. However, when I click cancel (lets say a user changes their mind) and decides a couple minutes later to activate the modal, nothing happens. The background is grayed out but no dialog box. I'm using the following to cancel:

    dialog = $("#dialog-form").dialog({
    autoOpen: false,
    height: 400,
    width: 350,
    modal: true,
    buttons: {
        "update an item": function() {
        Cancel: function() {
    close: function() {
       allFields.removeClass( "ui-state-error" );

Anyone else ran into this issue? I've seen others on here but it doesn't look related to what I'm facing.

  • Can you please provide a working demo in code pen? Nov 6, 2019 at 5:33
  • Is there any error when you again try to open the dialog ? Nov 6, 2019 at 12:02
  • No errors. I have a link that starts the Modal Dialog. The Dialog Box opens with the background html grayed out. If I submit, it refreshes and submits to the list like it supposed to. I can then click the link again to make changes. However, If I click cancel, I am back to the page again. Then when I click the link, no modal dialog box but the background is grayed. So I have to refresh. Does the cancel also have to have a reload element?
    – adams-j
    Nov 6, 2019 at 12:16
  • Ideally it should not. Can you try by refreshing the page once you click on cancel? Nov 6, 2019 at 12:33
  • 1
    Re-Initiate the Dialog Object in your close function and check Nov 6, 2019 at 12:42


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.