jquery在提交表单之前在对话框中验证表单

目前我在页面上有一组字段。点击按钮后，如果这些字段的验证通过，将出现一个对话框模式框。该表格有几个其他字段必须填写，然后才能提交表格。jquery在提交表单之前在对话框中验证表单

如何证明第一组字段是有效的，然后在提交表单的同时打开对话框，直到对话框字段也被验证为止？

$("#check-button") 
    .button() 
    .click(function(e) { 
     // Section 1 
     $(':text, select, textarea').each(function() { 
      if ($(this).val().length == 0) { 
        $(this).css('border', '2px solid red'); 
        e.preventDefault(); 
      } 
     }); 

     //Section 2 
     //e.preventDefault(); 
     //$('#my_form').submit(); 
     //$("#dialog-form").dialog("open"); 
});

我已经尝试过评论上述两节。第1部分将所有内容都突出显示，并且不会提交表单。第2部分将我的表格提交给第二个正在验证的项目。两部分的输入都是同一表单的一部分。请让我知道是否还有别的东西我应该解释这种情况。总之，我正在寻找一种方法来验证基于id的每个项目，并且一旦第一组已经通过，打开对话框，允许用户输入第二组并且验证第二组字段。最后，提交表格。

预先感谢您的任何指导。

来源

2011-02-24 Rosemary

检出ValidForm;它实现了为表单验证做所有事情的JQuery。去谷歌上查询！ :) – blanknamefornow 2011-02-24 22:36:28

这样做的一种方法是创建一个验证函数，如果所有字段都看起来不错，则返回return false; ...如果它返回true，则显示对话框。

一个简单的例子给你（我做我自己的变化，但你应该明白我的意思）：http://jsfiddle.net/iwasrobbed/acU4Q/1/

顺便说一句，如果你检查0长度在球场上，请确保您使用trim()所以你删除任何空格。你现在拥有它的方式，按一次空格键实际上意味着即使字段为空，输入也是有效的。

来源

2011-02-25 00:00:06 iwasrobbed

您可以将所需的任何行为绑定到表单的提交操作。下文介绍形式在AJAX外出我会怎么做：

$(document).ready(function() { 
    $("form#first").submit(function() { 
    if (validate(this)) { $("form#second").show(); } 
    return false; // to prevent the form from going to your server 
    }); 
    $("form#second").submit(function() { 
    var form = $(this); 
    if (validate(form)) { 
     $.ajax({ 
     url: form.attr("action"), 
     data: form.serialize() + $("form#first").serialize(), 
     type: form.attr("method"), 
     dataType: "script" 
     }); 
    } 
    return false; 
    }); 
});

基本上，如果第一种形式是有效的，你打开第二种形式。那么如果第二种形式是有效的，你提交的数据都是表格。

如果你想同步做到这一点，我的理解是，你可以为$.ajax的async选项设置为false和和dataType行动"html"，虽然我从来没有这样做我自己。

来源

2011-02-25 00:00:39 muirbot

jquery在提交表单之前在对话框中验证表单

回答

相关问题