Сложенные диалоговые окна jQuery UI - PullRequest
1 голос
/ 13 октября 2010

У меня есть одно модальное диалоговое окно в моем приложении, которое работает очень хорошо.Я делаю настройку и открываю диалоговое окно со следующими функциями

$(document).ready(function () {
    $("#__gsl_DialogPanel").dialog({
        autoOpen: false,
        resizable: false,
        position: 'center',
        stack: true,
        height: 'auto',
        width: 'auto',
        modal: true
    });
});

function loadDialog(action, id, title, onCloseHandler) {
    $("#__gsl_DialogPanel").dialog("option", "title", title);
    var url = action;
    if (id != "") url = url + "/" + id;
    $.ajax({
        type: "get",
        dataType: "html",
        url: url,
        data: {},
        success: function(response) {
            $("#__gsl_DialogPanel").html('').html(response).dialog('open');
        }
    });
}

Теперь у меня есть требование открыть другое диалоговое окно с помощью кнопки, которая находится в предыдущем диалоговом окне.Я создал еще один div ("__gsl_DialogPanel_2L") и клонировал функцию setup и open со ссылкой на новый диалог, как показано в следующем коде

$("__gsl_DialogPanel_2L").dialog({
    autoOpen: false,
    resizable: false,
    position: 'center',
    stack: true,
    height: 'auto',
    width: 'auto',
    modal: true
});

function loadDialog2L(action, id, title, onCloseHandler) {
    $("#__gsl_DialogPanel_2L").dialog("option", "title", title);
    var url = action;
    if (id != "") url = url + "/" + id;
    $.ajax({
        type: "get",
        dataType: "html",
        url: url,
        data: {},
        success: function (response) {
            $("#__gsl_DialogPanel_2L").html('').html(response).dialog('open');
        }
    });
}

Проблема в том, что второй диалог вообще не открывается.Я проверил с помощью инструментов Chrome Developer и вижу, что div содержит правильный HTML, который был получен из вызова ajax, но все еще имеет «display: none» в свойстве стиля.

Где я делаю неправильно?

Обновление:

Это используемые div.Они находятся на главной странице сразу после тега BODY.

<!-- Generic Dialog Panel  -->
<div id="__gsl_DialogPanel" style="display:none" title=""></div>
<!-- 2 Level Dialog Panel  -->
<div id="__gsl_DialogPanel_2L" style="display:none" title=""></div>

2-е обновление :

Я создал упрощенный образец для JSBin ,Вы можете найти это здесь .Любая помощь?

1 Ответ

0 голосов
/ 13 октября 2010

Я смог заставить ваш пример работать на jsbin, изменив второй идентификатор div (и ссылки на него) на "foo".Я подозреваю, что произошла какая-то коллизия имен - возможно, в имени переменной в Javascript или идентификаторе div есть максимальное количество значащих символов в имени переменной?(Искал недолго, но я не могу найти, что указано где-либо, однако).

...