4

jquery フォーム検証プラグイン ( http://docs.jquery.com/Plugins/Validation/validate#toptions )で使用できるオプションのリストを確認してきました。オプショングループがどのように機能するかを理解しようとしています。公式 (?) Web サイトで入手できる唯一のコードは次のとおりです。

// Use a table layout for the form, placing error messages in the next cell after the input.
$("#myform").validate({
  groups: {
    username: "fname lname"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "fname" 
                 || element.attr("name") == "lname" )
       error.insertAfter("#lastname");
     else
       error.insertAfter(element);
   },
   debug:true
 })

「fname」と「lname」という 2 つの要素を 1 つの形式でグループ化する「username」というグループを作成していることは理解していますが、その groupd はどのように使用されますか? 実際、最初の質問は、グループは何のためにあるのかということです。グループ内の要素を単一のユニットとして処理し、要素のいずれかがトリガーされた場合に単一のエラーを表示するようにプラグインに指示することだと思いました(たとえば、ルールを使用して2つのテキストボックスが必須としてマークされている場合)要素のいずれかまたは 2 つに値が欠落している場合、2 つの要素にエラーがある場合は 2 つではなく 1 つのエラー ラベルが表示されます)、いくつかの例で試してみましたが、できませんでしたこのように機能させるには。それで、それらは何のためにありますか?それらをどのように使用すればよいですか?

4

1 に答える 1

7

このオプションが行うことの要約はgroups、グループ内のすべてのものに対して 1 つのエラー メッセージのみを報告することです。fname与えられた例で、 andlnameと両方が必要であるとグループ化しなかった場合、2 つのエラー メッセージが表示されます。グループでは、1 つしか取得できません。グループの両方の要素が引き続き必要です。

正しく理解しているように聞こえますが、その例が機能しない理由を理解するのは困難です。この HTML では:

<form id="myform">
  First Name: <input type="text" name="fname" id="fname"/><br>
  Last Name: <input type="text" name="lname" id="lname"/><br>

    <input type="submit"/>
</form>​

そして、この検証コード:

$("#myform").validate({
    rules: {
        fname: { required: true },
        lname: { required: true }
    },
  groups: {
    username: "fname lname"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "fname" 
                 || element.attr("name") == "lname" )
       error.insertAfter("#lname");
     else
       error.insertAfter(element);
   }
 })​

私には問題ないようです: http://jsfiddle.net/ryleyb/cbJj6/

私が誰かを助けたもっと複雑な例はここにあります: Using the jQuery validate plugin to check if one or more channels (with different names) are selected
チェックされていない場合は、メッセージが 1 つだけ必要でした。

于 2013-01-03T21:01:03.637 に答える