如何验证一个大表格

I will try to explain my problem: I have one form (I can make second, but i want to have one). And I want to validate the form Using HTML5 or by Jquery plugin for validation and the problem is:

我会尝试解释我的问题:我有一个表格(我可以做第二个,但我想要一个)。我想验证表单使用HTML5或Jquery插件进行验证,问题是:

One of the form-fields are for registred users and another one is for new users. So I need to detect valid form or focused? Because HTML5 wan to validate full form. How you are solving this problem? BTW: I'm using Bootstrap 3.

其中一个表单字段用于注册用户,另一个用于新用户。所以我需要检测有效的表格或集中注意力?因为HTML5要验证完整的表单。你是如何解决这个问题的? BTW:我正在使用Bootstrap 3。

For Exp:

<div class="col-md-12 well">
            <div class="col-md-6">
                 <form id="checkout-login" action="" method="post">  
            <h3>Existing User</h3>
                <div class="form-group">
                    <label for="email">Email</label>
                    <input type="text" class="input-fancy" id="email" placeholder="E-mail" name="email" required="required" autocomplete="on">
                </div>
                <div class="form-group">
                    <label for="password">Heslo</label>
                    <input type="text" class="input-fancy" id="password" placeholder="********" name="password" required="required" autocomplete="off">
                </div>
             </div>
            <div class="col-md-6">
             <h3>New user</h3>
                <div class="form-group">
                    <label for="Name">Name</label>
                    <input type="text" class="input-fancy" id="name" placeholder="Name" name="name" required="required" autocomplete="on">
                </div>
                <div class="form-group">
                    <label for="surname">Surname</label>
                    <input type="text" class="input-fancy" id="surname" placeholder="Priezvisko" name="surname" required="required" autocomplete="on">
                </div>
                <div class="form-group">
                    <label for="email">Email</label>
                    <input type="text" class="input-fancy" id="email" placeholder="E-Mail" name="email" required="required" autocomplete="on">
                </div>
                <div class="form-group">
                    <label for="password">Heslo</label>
                    <input type="text" class="input-fancy" id="password" placeholder="********" name="password" required="required" autocomplete="off">
                </div>
                 </div>
           <input type="submit" class="btn btn-green btn-lg" value="Pokračovať"></input>
            </form>

         </div>

JQuery, please help me with ** and you can ignore //

JQuery,请帮我**,你可以忽略//

  $(document).ready(function () {
     $("form").submit(function (e) { e.preventDefault() });
    if(**find valid form){
    $("**then $(this) is valid --> send").submit(function (e) {
        e.preventDefault();
        $.ajax({
            url: '',
            data: //my custom,
            success: function (data) {
                //Show Thank you
            },
            cache: false
        });
    });
   }else{
     //Show alert please register or login
   }
});

Thank you for any answer, advice or comment.

感谢您的任何回答,建议或评论。

1 个解决方案

#1

here is the validation plugin jquery validate demo, i used it with bootstrap. It has lots of option for customization. That makes a good choice if you’re building something new from scratch, but also when you’re trying to integrate it into an existing application with lots of existing markup. The plugin comes bundled with a useful set of validation methods, including URL and email validation, while providing an API to write your own methods. All bundled methods come with default error messages in english and translations into 37 locales.

这是验证插件jquery验证演示,我用它与bootstrap。它有很多自定义选项。如果您从头开始构建新的东西,那么这是一个很好的选择,当您尝试将其集成到具有大量现有标记的现有应用程序时。该插件捆绑了一组有用的验证方法,包括URL和电子邮件验证,同时提供API来编写您自己的方法。所有捆绑方法都带有英语的默认错误消息和37个语言环境的翻译。

Code is available on https://github.com/jzaefferer/jquery-validation

代码可在https://github.com/jzaefferer/jquery-validation上找到

1 个解决方案

#1

更多相关文章

随机推荐