jQuery UI对话框按钮提交问题

Question

作为jquery ui的学生，我很难找到如何设置要提交的对话框按钮。 在输入标签上，我使用type属性允许浏览器执行“电子邮件”验证，对于密码，我使用pattern属性和标题。

                <input
                    type="email"
                    name="EMAIL_0000"
                    id="EMAIL_0000"
                    tabindex="12"
                    size="40"
                    placeholder="Username"
                    value=""
                    required/>
                <input
                    type="password"
                    name="PASSWORD_0000"
                    id="PASSWORD_0000"
                    tabindex="13"
                    pattern="<?php echo $PasswordPattern; ?>"
                    value=""
                    placeholder="Password"
                    title="See notes for valid password."
                    required/>

当按下提交按钮时，用户将看到如下内容：

我无法发布图片，因为我没有10个声誉发布图片...。

您会注意到有两个“登录”按钮。 上方区域（在表单区域中）是type =“ submit”按钮。 较低的一个由jquery ui对话框创建，如下所示：

    $(“#form_0000”).dialog({
      Var username = $(“#EMAIL_0000”).val(),
      Password=$(“#PASSWORD_0000”).val(),….
      buttons: {
          “Sign On”: function(){
// here I perform a $.ajax() to verify the email is in the data base. But the browser validation does not occur.
…….
    }

当按下下面的“登录”按钮时，不会发生浏览器验证，所有验证都必须在jquery对话框中使用$ .ajax来访问php函数以进行服务器端数据库查询。

根据我的研究，我不认为jQuery UI具有允许设置按钮类型属性的功能。 我所能看到的就是设置按钮的名称。

在这一点上，我相信我唯一的选择是在表单本身中设置一个按钮，并指示它是一个提交按钮，并且当按下该按钮时，会进行浏览器验证，但是然后我在验证电子邮件地址是否存在以及密码是否为（我可以显示一个警报框，但不能显示我想要的外观），一旦处理完成，对话框就会消失，不允许用户从其他“对话”按钮之一中进行选择，等等。 。

是否有人在限制方面有所努力，可以为解决方案提供一些见识？

我想我可以删除下面的“登录”按钮，而仅使用表单提交按钮，并保持关闭浏览器验证和可编程验证的过程，这些过程显示错误消息并保留在对话框屏幕上。 我可以将代码移到

$( "#btnSignOn_0000" )
    .click(function() {
        // move dialog 'sign on' button code here.
    });

我想等待一些答复，并在不需要时避免其他工作。

Answer 1

抱歉，您带领我们走错了路。 但是自从我这样做之后，我就弄乱了代码，并为您解决了这个问题。

取消注释对话框中具有的按钮，但不通过将css设置为来显示它：

#btnSignOn_0000 {
    display: none;
}

现在，在对话框代码中，而不是$（'formSignOn'）。submit（）; 采用：

$("#form_0000").dialog({
      buttons: {
          “Sign On”: function(){
              $('#btnSignOn_0000').click();
          }
      }
});

单击按钮，触发验证，并且除非表单通过验证，否则不执行$（'formSignOn'）。submit（function（）{}）。

Answer 2

这是最终的解决方案：

$('#formSignOn').submit(function( e ){
   e.preventDefault();

这样可以防止执行ajax功能后提交关闭对话框窗口。