2

特定のフォームに表示するものをデータベースから取得するので、フォーム要素は動的です。

フォームの表示方法に応じて、ラジオボタン、チェックボックス、またはテキストボックス/テキストエリアを表示します。

誰かがフォームを送信する前に、各フォーム エントリ (ラジオ、チェックボックス、テキスト ボックスなど) が選択されていることを確認する必要があります。

これらの動的フォーム要素に検証を挿入するにはどうすればよいですか?

例：

<input type="checkbox" id="@formInputId" name="@formInputName" value="@element.Id"  />
4

10 に答える 10

2

jquery 検証プラグインを見たことがありますか? 車輪の再発明を試みる理由。使い方はとても簡単です。

このデモをチェック

ここに公式ドキュメントへのリンクがあります。http://jqueryvalidation.org/documentation/

于 2013-09-18T14:57:11.170 に答える
0

jQuery Validation Pluginを使用して同じ要件を達成しました

次のコードをページのスクリプト セクションに配置します。form-dataクラスをフォームに追加required_fieldし、要素をページに追加しながら追加する必要があります。

var validator = null;
$(document).ready(function () {
    try {
        var validatedForm = $(".form-data");
        validator = validatedForm.validate && validatedForm.validate({
            rules: {
                required_field: {
                    required: true
                }
            },
            messages: {
                required_field: {
                    required: " "
                }
            },
            errorElement: "span",
            showErrors: function (errorMap, errorList) {
                this.defaultShowErrors();
            },
            highlight: function (element) {
                // do something like
                $(element).closest('...').removeClass('success').addClass('error');
            },
            unhighlight: function (element) {
                // do something like
                $(element).closest('...').removeClass('error');
            },
            submitHandler: function(form) {
                // submit form
                form.submit();
            }
            success: function (element) {
                // do something like
                $(element).closest('...').removeClass('error').end().remove();
            },
            onfocusout: function (element) {
                $(element).valid();
            },
        });

        $.each($(".required_field"), function (index, value){
            $(value).rules( "add", {
                  required: true,
                  messages: {
                      required: " "
                  }
            });
        });
    } catch(err) {
        console.log("javascript error", err);
    }
});

送信中に、フォームが有効かどうかを確認できます。

if($('#formId').valid()) {
    ...
于 2013-09-25T12:33:29.983 に答える
0

$.validate プラグインを使用してクライアント側の検証を行い、POST アクションでデータを検証するメソッドを作成するのが最善の方法だと思います。物事を整理するために、javascript を csharp や他の場所と混在させないことを常にお勧めします。

于 2013-09-25T13:52:24.873 に答える
0

目立たない検証で要素を動的に解析できるはずですが、最初に適切な検証をトリガーするために適切な属性を追加する必要があります。基本的に、この質問で起こっていることと非常によく似ており、JavaScript によって要素を動的に追加しています。

于 2013-09-18T14:26:30.627 に答える
0

Jquery Validate engineを使用することもできます。

その中で、動的要素のクラス属性を管理するだけです。

Hook of Jquery Validate Engine を使用することをお勧めします。

それはあなたにとって簡単です。

于 2013-09-24T06:48:33.927 に答える
0

検証の json ブロブを出力できる場合は、これを使用できます: https://github.com/parris/iz#json

ルールの JSON ブロブを次のように指定できます。

var rules = {
    'cost': [
        {
            'rule': 'between',
            'args': [17, 1000],
            'error': 'The cost must be between 17, 1000'
        },
        {
            'rule': 'required',
            'error': 'You must specify a cost'
        },
    ],
    'producer.id': [
        {
            'rule': 'int',
            'error': 'Producer ID must be an int'
        }
    ],
    'producer.name.first': [
        {
            'rule': 'alphaNumeric',
            'error': 'Must be names and numbers'
        }
    ]
};

次に、値を収集し、次のように検証します。

are(rules).validFor({
    cost: 20,
    producer: {
        id: 1,
        name: {
            first: 'bob'
        }
    }
});

必要なものとかなり厳密に一致する必要がある組み込みの検証がいくつかあります。そうでない場合は、いくつかのカスタム検証でシムできます。

注: Iz は、私が作成したライブラリです。はい、今、完全に売り込んでいます。

于 2013-09-18T17:22:49.973 に答える