Как я могу закрыть диалог jquery ui внутри кода диалога? - PullRequest
Новая
       24

Как я могу закрыть диалог jquery ui внутри кода диалога?

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

Я использую несколько диалогов jquery ui в своем приложении для сбора информации от пользователей и для операций CRUD. Когда на странице мне нужно диалоговое окно, я делаю следующие шаги:

Сначала я определяю минимальную разметку и код, необходимый для инициализации диалога, как это 

<div id="dialogPanel" style="display:none" title=""></div>

и, когда DOM готов, 

$("#dialogPanel").dialog({
    autoOpen: false, hide: 'slide', show: 'bounce', resizable: false, 
    position: 'center', stack: true, height: 'auto', width: 'auto', 
    modal: true, overlay: { opacity: 0.5, background: "white" }
});

Затем я загружаю контент в диалоге, когда мне это нужно, используя ajax-вызовы, как это 

<button id="addCustomer">Add Customer</button>

и это 

$("#addCustomer").button().click(function(event) {
    event.preventDefault();
    loadDialog("/Customer/Create", "", "Add New Customer");
});

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

Вызов ajax возвращает строго типизированное представление , которое будет отображаться в диалоге и даже динамически изменять его размер. Строго типизированное представление имеет несколько кнопок, которые, в свою очередь, выполняют другие вызовы ajax (например, для действия контроллера, которое проверяет и сохраняет в базе данных). Эти вызовы обычно возвращают HTML-код, который будет добавлен в диалог DIV.

Теперь мой вопрос: как мне закрыть диалог? Я могу сделать это, нажав кнопку «X» в верхнем правом углу диалогового окна или нажав клавишу ESC, но я хотел бы сделать это как следствие нажатия кнопки, которая находится внутри строго типизированного представления. *

Однако я не хочу использовать этот вид кода 

$("#dialogPanel").dialog('close');

внутри строго типизированного представления, которое само по себе не определяет #dialogPanel DIV.

Что может быть хорошим решением?

1 Ответ

2 голосов
/ 01 октября 2010

Создайте функцию closeDialog в главной форме и вызовите эту функцию из диалога.Тогда любая другая страница, на которой размещено диалоговое окно, также должна определить функцию «closeDialog».

Кроме того, вы можете передать делегат, указывающий на функцию closeDialog, для дальнейшего разделения вещей.

...