2011-05-31 103 views
1

我想弄清楚为什么我的错误消息没有出现在对话框中,为什么当我填写表单并单击“发送电子邮件”时,对话框没有关闭。我确定这是我失踪的东西,但我没有看到它。jquery对话框验证

悬崖:我点击主页面上的一个链接(同一个类,因为有多个链接),弹出一个对话框,要求输入姓名,电子邮件和密码。名称和电子邮件是必需的,错误消息应显示在一个漂亮的UI警报框中。相反,错误消息显示在文本框下方,并且正确填写表单字段时,对话框不会关闭。

我在做什么错?

<html> 
    <a href="Class1" class="Roster">View Roster</a> 
    <a href="Class2" class="Roster">View Roster</a> 
    <a href="Class3" class="Roster">View Roster</a> 
    <a href="Class4" class="Roster">View Roster</a> 
. 
. 
</html> 

$("#RosterForm").validate({ 
    errorContainer: "#errorblock-div1, #errorblock-div2", 
    errorLabelContainer: "#errorblock-div2 ul", 
    wrapper: "li", 
    rules: { 
     FullName: { required: true }, 
     Email: { required: true } 
    }, 
    messages: { 
     FullName: { required: "Please enter your name." }, 
     Email: { required: "Please enter your email address." } 
    }, 
    submitHandler: function(form) { 
     jQuery(form).ajaxSubmit({ 
      target: '#client-script-return-data', 

      success: function() { $(".dialog_form").dialog("close"); successEvents('#client-script-return-msg'); } 
     }); 
    } 
}); 

$(".Roster").click(function(event) { 
    event.preventDefault(); 
    URL = "roster.cfm?" + $(this).attr("href"); 
    $('<div class="dialog_form">').dialog({ 
    title: "Student Roster", 
    width: 800, 
    height: 650, 
    modal: true, 
    open: function() 
     { 
     $(this).parent().appendTo("#RosterForm"); 
     $(this).load(URL); 
     }, 
    close: function() { 
     $(".dialog_form").remove(); 
    }, 
    buttons: { 
       "Send Email": function() { $("#RosterForm").submit(); }, 
       "Cancel": function() { $(this).dialog("close"); }  
      } 
}); 

return false; 
}); 

回答

0

添加有条件的“发送电子邮件”按钮:

buttons: { 
    "Send Email": function() { 
     if (jQuery(#RosterForm").valid() { 
      $("#RosterForm").submit(); 
     } else { 
      // display errors 
     } 
    }, 
+0

你给的代码没有任何帮助的。它确实在对话框中提交表单,但对话框不会关闭。 – Duane 2011-05-31 15:19:50

+0

$(this).dialog('close'); – gnome 2011-06-01 17:30:37