0

Twitter ブートストラップと asp.net を使用して、ユーザー情報を取得する Web ページを作成しています。このリソースを参照として使用しています... 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 
<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 に答える
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 に答える