Диалоговият прозорец на JQuery UI работи само веднъж

Имам диалогов прозорец на JQuery UI, който отваря друга страница в него. След като щракна върху Отказ и опитам да щракна отново, не се отваря. Търсих онлайн и намерих отговор, който казваше, че трябва да инициализирам диалоговия прозорец само веднъж и просто да извикам отворен, когато потребителят щракне върху бутона. Опитах се да преместя кода за инициализиране в секцията за зареждане на страницата и да направя само dialog("open") за бутона, но все още имам същия проблем като преди. Как настройвате диалоговия прозорец, за да можете да отмените и да го отворите отново?

Код за инициализиране:

var scanDialog = $( "#dialog" ).dialog({
                  height:600,
                          width:800,
                  modal: true,
                          autoOpen:false,
                  buttons: {
                    "Scan": function() {
                         //scanning code 
                    },
                    Cancel: function() {
                                 scanDialog.load("url.html").dialog("close");
                    }
                  }
                });

Код за зареждане:

scanDialog.load("url.html").dialog('open');

javascript dialog jquery jquery-ui jquery-ui-dialog
person user2387503    schedule 16.05.2013    source източник
comment
Заменяте ли елемента #dialog, когато зареждате новата страница?   -  person Barmar    schedule 16.05.2013
comment
Дали това би било извикване на _destroy() по някаква причина? Може да загубите идентификационната си карта по този начин.   -  person abdkw    schedule 16.05.2013
comment
Никога не съм имал проблем с повторното използване на диалогов прозорец повече от веднъж. Виждам, че зареждате URL адрес, преди да отворите... Възможно ли е вашият URL адрес да съдържа друг елемент с идентификатор, равен на вашия диалогов идентификатор, причиняващ конфликти?   -  person Baral    schedule 16.05.2013

Отговори (3)


arrow_upward
1
arrow_downward

Опитайте да унищожите диалоговия прозорец от DOM

 scanDialog.load("url.html").dialog("destroy");

За да не загубите идентификатора на div, можете да добавите идентификатора на диалоговия прозорец към неговото родителско DOM име.

     var DialogParent = $(this).parents("div:eq(0)");
      var Diag = myParent.attr('id') + 'Diag';

      var scanDialog = $( "#" + Diag ).dialog({
                  height:600,
                          width:800,
                  modal: true,
                          autoOpen:false,
                  buttons: {
                    "Scan": function() {
                         //scanning code 
                    },
                    Cancel: function() {
scanDialog.load("url.html").dialog("destroy");// Destroy, not close
                    }
                  }
                });

Тогава,

 $("#" + Diag).dialog('open');
person Hariprasad    schedule 16.05.2013

arrow_upward
0
arrow_downward

Може би не е правилен отговор, но имах подобен проблем с това преди няколко месеца и това беше заради свойството "modal:true". Трябваше да премахна модалното свойство, за да направя бутона да функционира. Мисля, че това е грешка в jquery.

person Arian    schedule 16.05.2013

arrow_upward
0
arrow_downward

Това изглеждаше като ненужно досаден проблем. Използването на „автофокус“ ​​ще работи само веднъж. Някои корекции работеха в IE, но не и в Chrome. Така че, за да поправя, имах нужда от няколко стъпки, част от които беше включването на „.dialog(‘destroy’)“, споменат по-горе. Добавях фокус върху бутона „Да“ в изскачащия диалогов прозорец.

Първо, добавих отворена функция с извикване на focus(). В нашата система изискваше обвивката „setTimeout“:

open: function()
{
    setTimeout(function() {
        $('#yesDialog').focus();
    }, 100);
},

Добавете „id“:

}, id: 'yesDialog'

И важна, ключова стъпка беше промяната на диалоговия прозорец „затвори“ на диалоговия прозорец „унищожи“:

И така от:

$(this).dialog('close');

To:

$(this).dialog('destroy');

Изваждайки нашия специфичен пух, събирането на всичко изглежда приблизително така:

var prompt = 'Are you sure?';
$('<p>'+prompt+'</p>').dialog({
    autoOpen: true,
    draggable: false,
    modal: true,
    title: 'Save Data',
    dialogClass: 'no-close',
    open: function() {
        setTimeout(function() {
            $('#yesDialog').focus();
        }, 100);
    },
    buttons: [{
        text: 'Yes',
        click: function() {
            $(this).dialog('destroy');
            //...our fluff
        }, id: 'yesDialog'
    }, {
        text: 'No',
        click: function() {
            $(this).dialog('destroy');
        }
    }]
});
person Crazy Cat    schedule 14.08.2018