Почему это диалоговое окно jquery не отображается?

У меня есть форма, которая использует проверку jquery. Когда пользователь нажимает кнопку отправки, у меня есть некоторый jquery, который перехватывает отправку и должен отображать диалоговое окно с просьбой проверить информацию, которую он ввел в форму. Это диалоговое окно должно отображаться только в том случае, если форма прошла проверку. Вот мой код:

$('#form').submit(function(){
    fillVerificationDialog();   /* This loads up the dialog with form data */
    if (('#form').valid()){
        $('verification_dialog').dialog('open');
        return false;
    }
});

Мое диалоговое окно не отображается. Он просто отправляет форму. И я проверил, что форма действительна, используя предупреждение, которое проверяет значение $('#form').valid()

Если я удаляю оператор if и просто получаю строку, открывающую диалоговое окно, диалоговое окно отображается. Однако он будет отображаться, даже если в форме есть ошибки, что я и пытаюсь предотвратить.


person user338413    schedule 13.05.2010    source источник


Ответы (2)


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

$('#verification_dialog').dialog({ autoOpen: false });

Отсутствует # в вашем селекторе. Поскольку селектор, который вы хотите использовать, скорее всего, является идентификатором div, диалоговое окно не откроется, так как в нем отсутствует символ #.

$('#verification_dialog').dialog('open');
person Gabe    schedule 13.05.2010
comment
Nitpick: это не недопустимый селектор. - person SLaks; 13.05.2010
comment
@SLaks - правдивая история, я это исправил. - person Gabe; 14.05.2010
comment
Вы правы, я пропустил #, но даже с ним диалоговое окно не открывается. Форма отправляется в любом случае. - person user338413; 14.05.2010
comment
Вы инициализировали диалог перед попыткой открыть его? Проверьте мой обновленный ответ. - person Gabe; 14.05.2010
comment
Да, я создал отдельную функцию с именем initVerificationDialog, которая выглядит так: function initVerificationDialog() { //Инициализировать диалоговое окно проверки $('#verification_dialog').dialog({ autoOpen: false, bgiframe: true, resizable: false, modal: true, высота: 600, ширина: 600, кнопки: { Форма отправки: function() { document.account.submit(); }, Cancel: function() { $(this).dialog(close); } } }) ; } - person user338413; 14.05.2010
comment
Моя основная функция выглядит так: Моя основная функция выглядит так: $(function() { initFormValidation(); initVerificationDialog(); fillVerificationDialog(); $('#form').submit(function() { if ((' #form').valid()){ $('#verification_dialog').dialog('open'); return false; } }); }); - person user338413; 14.05.2010
comment
Может быть, просто попробуйте инициализировать его более простой формой, такой как моя выше, чтобы исключить любые возможные проблемы с синтаксисом. Затем, если это сработает, начните добавлять вещи по одному. - person Gabe; 14.05.2010

Вы уверены, что вызываете проверку формы перед ее отправкой и настройкой диалогового окна?

$('#form').validate();
$('#verification_dialog').dialog({
     autoOpen: false,
     buttons: {
         'OK': function() {
                 ... do form submission...
               },
         'Cancel': function() {
                 $(this).dialog('close');
               }
    }
 });
$('#form').submit(function(){ 
    if (('#form').valid()){
        fillVerificationDialog();   /* This loads up the dialog with form data */ 
        $('#verification_dialog').dialog('open'); 
    } 
    return false;
});
person tvanfosson    schedule 13.05.2010
comment
См. выше, моя основная функция вызывает initFormValidation(). Это содержит все мои правила проверки и сообщения. После этого основная функция вызывает initVerificationDialog(), которая создает диалог. Затем вызывается fillVerificationDialog(), который заполняет диалог данными, введенными пользователем из формы. Наконец, я запускаю функцию для кнопки отправки, которая проверяет, действительна ли форма. - person user338413; 14.05.2010