0

チェックボックスがチェックされている場合にのみ、テキストフィールドまたはドロップダウンが検証されるjquery検証を実行しようとしています。

ここに私が持っているものがあります:

@using (Ajax.BeginForm("SomeAction", "SomeController", new { id = Model.Id }, new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "somePanel", InsertionMode = InsertionMode.Replace }, new { @id = "testForm" }))
{
 @Html.DropDownListFor(x => Model.SelectedValue, Model.YesNoList, " ", new { @id ="drpYesNo" })
 @Html.TextAreaFor(x => x.CriminalText, new { @id = "txtSomeField" })

<input type="submit" value="Save" />
}

JavaScriptにはこれがあります:

<script type="text/javascript">
    jQuery.validator.messages.required = "";
    $("#testForm").validate(
    {
        rules: {
            txtSomeField: {
                required: function (element) {
                    return $("input:checkbox[name='drpYesNo']:checked").val() == 'Yes';
                }
            }
        }

    });

    $("#testForm").on("submit", function () {
        if (!$(this).valid()) {
            return false;
        }
    });
</script>

私はオンラインのいくつかの例に従っていますが、うまくいかないようです。どんな助けでも大歓迎です。独立記念日おめでとう!

4

2 に答える 2

2

jquery バリデータ ルールを定義するときは、ルールを定義する要素のIDではなく、名前を使用する必要があります。したがって、あなたの場合、あなたの名前はありません(明らかに、これがエディターテンプレート内にある場合、名前は異なる場合があります。たとえば、)。<textarea>CriminalTexttxtSomeFieldFoo.Bar[3].CriminalText

したがって、最初のステップは適切な名前を使用することです。

rules: {
    CriminalText: {
        required: function (element) {
            ...
        }
    }
}

次に、2 番目のステップを見てみましょう。セレクター:checkboxでは、DOM のどこにも表示されないものを使用しました。私が見ることができるのは(少なくともあなたがここに示したものでは)DropDownListとテキストエリアだけです。したがって、ユーザーがリスト内<textarea>の値を選択した場合にのみ必要になるようにする場合は、次のようにルールを定義できます。Yes<select>

rules: {
    CriminalText: {
        required: function (element) {
            return $('#drpYesNo').val() == 'Yes';
        }
    }
}

これは明らかに、次のオプションが選択されていることを前提としています。

<select>
    <option value="Yes">Yes, of course</option>
    ...
</select>

最後に、スクリプトをページに含めていないことを確認してjquery.validate.unobtrusive.jsください。これは、Microsoft の控えめなライブラリを使用して、ヘルパーによって生成された HTML5 data-* 属性に基づいて jQuery.validate ルールを自動的に作成し、完全に混乱させるためです。カスタム ルールの設定。

于 2012-07-04T16:12:07.923 に答える
1

ここでのセレクターが問題です。使用input:checkboxはチェックボックス用です。通常、jquery は CSS クラス名または ID を優先します。

required: function (element) {
  return $("#drpYesNo").val() === 'Yes';
}
于 2012-07-04T14:52:04.500 に答える