JQuery Dialog Validation - PullRequest
       11

JQuery Dialog Validation

1 голос
/ 08 марта 2011

Моя проблема в том, что весь JavaScript, который я применяю к загружаемому ajax диалогу JqueryUI, не работает, когда я закрываю диалоговое окно, а затем открываю другой.

Несколько вещей, которые я заметил, это то, что когда я закрываю его, html просто становится скрытым, но фактически не удаляется.Вызов $ dialog.dialog ("уничтожить");не помогаетУдаление скрытого HTML тоже не помогает.Я не уверен, как уничтожить объект проверки (документы ничего не говорят об этом), или если это поможет при закрытии диалога, даже поможет.По сути, я просто хочу вернуться к исходной фразе загрузки страницы, когда я закрываю диалоговое окно, поэтому при открытии другой воссоздадим объект проверки и т. Д.Инициализируйте снова, как только я закрою первый диалог и открою другие.

Вот упрощенная версия моего кода для одного такого диалога -

var create_contact_dialog = function () {
    var $contactDialog = $('<div></div>')
    .dialog({
        autoOpen: false,
        dialogClass: "contact_form_dialog",
    });
    $contactDialog.dialog('open');
    return $contactDialog;
};

$('#open_contact_form').live('click', function () {
    var $contactDialog = create_contact_dialog();
    $contactDialog.load('/contact_form', function () {
        contact_form_validator = $("#contact_form").validate({
            rules: {
                name: {
                    required: true
                },
            }
        });
    });
});

Любые указатели приветствуются!

1 Ответ

1 голос
/ 08 марта 2011

Вам нужно будет удалить DOM для диалогового окна после его закрытия, поскольку загружаемая форма каждый раз имеет один и тот же точный идентификатор (что приводит к тому, что последующие загрузки по-прежнему ссылаются на первый DOM с этим идентификатором). Вы можете сделать это, предоставив функцию обратного вызова close, которая удаляет содержимое диалога:

var create_contact_dialog = function () {
    var $contactDialog = $('<div></div>')
    .dialog({
        autoOpen: false,
        dialogClass: "contact_form_dialog",
        close: function() {
            $contactDialog.remove();
        }
    });
    $contactDialog.dialog('open');
    return $contactDialog;
};

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

Пример jsfiddle

...