在提交时验证多个输入

时间:2013-04-08 19:44:21

标签: jquery

任何人都可以帮助我尝试验证多个输入以确保它们在我提交的时间点不为空。然后在#error中添加一些文本。

我的表单如下:

<div class="span12">
        <form method="post" name="bdayInputFormMain" action="/bdayremind_maininput/" class="form-inline">
        {% csrf_token %}
                <input name="name" type="text" class="input-medium" placeholder="Name">
                <input name="dob" type="text" class="input-small datepicker" placeholder="Date of Birth">
                <input name="addr" type="text" class="input-xlarge" placeholder="Address">
                <button type="submit" class="btn">Update</button>
        </form>
</div>

谢谢,

3 个答案:

答案 0 :(得分:1)

查看.submit()的文档。编写自己的验证方法相当容易,或者像其他人建议的那样使用库。

http://jsfiddle.net/rwFDT/

$('form').submit(function(){
   var $emptyFields = $();
   $('form').find('input').each(
       function(){
              if($(this).val() == ""){
                   $emptyFields.push(this)
             }
        });
  if($emptyFields.length != 0){
    $('form').find('input').css("border","");
    $emptyFields.css("border", "1px solid red");
    $("#error").html("<b><i>This is my error message</i></b>");
    return false;
  }else{
    return true;
  }
});

答案 1 :(得分:0)

这个验证库Parsley.js看起来很不错,可以满足您的需求。

答案 2 :(得分:0)

呀! jquery验证是客户端的最佳验证器之一。您应该为所需的字段使用必需的类。

请参阅文档http://docs.jquery.com/Plugins/Validation

您的表单如下所示:

http://jsbin.com/elemad/3/edit

我希望它有所帮助!