web-dev-qa-db-ja.com

ASP=

MVC3プロジェクトのページに動的に挿入されたフォームフィールドがいくつかあります。通常、jQuery検証サーバー側を追加しますが、この場合はできません（UIの複数のフィールドが1つの非表示フィールドの値を生成します。これが送信されます。非表示フィールドに対して検証することはできません。そのため、代わりに、ユーザーが表示できるフィールドにUIのみの検証を追加する必要があります）

フィールドがページに動的に追加されたら、コンテナに対して次のコードを実行します。

$container.find(".date").rules("add", {
    required: true,
    messages: {
        required: "The date is required"
    }
});

しかし、それは機能しません！奇妙なことに、上記のコードを無効にし、動的要素を作成し、ブラウザーのJSコンソールでコードを実行すると動作しますが、デフォルトの検証メッセージのみが表示されます。

私は迷っています。何か案は？

JQuery Validation 1.9.0と控えめなプラグインを使用しています

jqueryasp.netjquery-validateunobtrusive-validation
28
CBarr

Unobtrusiveプラグイン側で何が起こっているのかが理解できたので（どういうわけかASP.NETに関連していることを理解しています）、ここで何をする必要がありますか。

新しい要素を追加した後、$.validator.unobtrusive.parseElement(newElement)を呼び出すと、フォームに追加されます。答えが示唆したように、新しいフォーム要素にdata-valおよびdata-val-required属性を設定する必要があります。

だから、これで終わる：

//create new form element
$('form fieldset').append('<br>New Field: '+
     '<input type="text" data-val="true" data-val-required="A date is required." name="newField">'+
     ' * Also required');

//add new rules to it
$.validator.unobtrusive
  .parseElement($('form').find('input[name="newField"]').get(0));

ここに表示されます： http://jsfiddle.net/ryleyb/LNjtd/2/

8
Ryley

結局のところ、これは各フォーム要素にいくつかの属性を追加することにより、ほとんどHTMLで行うことができます：

  • name属性
  • data-val="true"
  • data-val-required="message"

そのようです：

<input type='text' name="date" data-val="true" data-val-required="A date is required." />

次に、フォームをJSで再解析する必要があります。

//Remove current form validation information
$("form")
    .removeData("validator")
    .removeData("unobtrusiveValidation");

//Parse the form again
$.validator
    .unobtrusive
    .parse("form");
62
CBarr

あなたはもっと単純な何か間違っていたと思う-あなたのfind('.date')は実際には何も見つけられなかったように。それ以外の場合、あなたのコードは私にとって非常に合理的に見えるからです。期待どおりに機能する例を次に示します。 http://jsfiddle.net/ryleyb/LNjtd/

これでコードを正しく検証できました：

$('form fieldset')
    .append('<br>New Field: <input type="text" name="newField"> * Also required')
    .find('input[name="newField"]').rules('add', {
      required: true,
      messages: {
        required: 'New field is required'
      }
    }
);​
1
Ryley