0

我正在使用 Twitter 引导程序和 asp.net 来构建一个网页来捕获用户信息。我将此资源用作参考... http://alittlecode.com/files/jQuery-Validate-Demo/

我有一个母版页,我在其中定义了一个表单

<form id="form1" class="form-horizontal" runat="server">

并包括对 JQuery 的引用...

 <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
 <script src="js/jquery.validate.min.js" type="text/javascript"></script>

在我的网页上,我有一个输入控件

<div class="control-group">
                <label class="control-label" for="name">
                    Your Name</label>
                <div class="controls">
                    <input type="text" class="input-xlarge" id="txtApplicantName" name="txtApplicantName" placeholder="First Name and Last Name"
                        runat="server">
                </div>
            </div>

该资源有一些 JQuery 代码来验证我无法工作的表单字段......

$(document).ready(function(){

 $('#contact-form').validate(
 {
  rules: {
    name: {
      minlength: 2,
      required: true
    },
    email: {
      required: true,
      email: true
    },
    subject: {
      minlength: 2,
      required: true
    },
    message: {
      minlength: 2,
      required: true
    }
  },
  highlight: function(label) {
    $(label).closest('.control-group').addClass('error');
  },
  success: function(label) {
    label
      .text('OK!').addClass('valid')
      .closest('.control-group').addClass('success');
  }
 });
}); // end document.ready

我已将 $('#contact-form').validate 更改为 $('#form1').validate 但它似乎不起作用,我做错了什么?

4

3 回答 3

0

规则的名称适用于文本框的类先试试这个:

    $(document).ready(function () {
        $("#form1").validate();
        jQuery.validator.messages.required = "*";
        jQuery.validator.messages.email = "Invalid Email"; //set any error message
    });

然后在 HTML 中

<input type="text" class="input-xlarge required" id="txtApplicantName" name="txtApplicantName" placeholder="First Name and Last Name"  runat="server">

一旦你得到验证工作,你可以弄乱每个规则

编辑:

现在对于表单上的其他输入,例如可能是这样的电子邮件地址输入,因为它有一类电子邮件,它将自动验证电子邮件地址。

<input type="text" class="input-xlarge email" id="txtEmail" name="txtEmail" placeholder="Email Address" runat="server">

现在,如果您想要一个客户规则——在您的示例中它看起来并不像您需要的那样,但无论如何您都是这样做的

$("#myinput").rules("add", {
 required: true,
 minlength: 2,    // chage to any number you want min-length
 messages: {
   required: "Required input",     
   minlength: jQuery.format("Please, at least {0} characters are necessary")
 }
});

如果您愿意,可以将更多选项添加到自定义规则中,请查看文档,但这就是它的外观

于 2012-11-05T02:50:43.150 回答
0
<input type="text" class="input-xlarge" id="txtApplicantName" name="txtApplicantName">

由于您输入的名称属性是“txtApplicantName”,因此您应该有类似的规则

rules: {
  txtApplicantName: {
    minlength: 2,
    required: true
  }
}

更新:检查您的 html 中的表单元素,我刚刚做了一些实验,似乎表单需要有一个“动作”属性。

于 2012-11-05T02:30:54.113 回答
0

$("#form1").validate();错了,应该是$("#<%= form1.ClientID %>").validate();

或者,如果您愿意,您可以保留代码不变,只需将此属性添加到您的表单标签

ClientIDMode="Static"
于 2012-11-05T03:49:41.637 回答