5

クライアント側の検証にjQuery検証プラグインを使用していますが、選択ボックスで検証が機能しません。

HTML

<select id="select" class="required">
    <option value="-1">Choose</option>
    <option value="child">test2</option>
</select>

JavaScript

$("#formid").validate({
    select: {
        required: function(element) {
            if ($("#select").val() == '-1') {
                return false;
            } else {
                return true;
            }
        }
    }
});

これを機能させるにはどうすればよいですか？

4

6 に答える 6

8

この問題を修正する簡単な方法は、無効なoption値に。を指定することです""。"Choose"次に、フォームでvalidateを呼び出すだけで、が選択されたときに送信されません。

HTML

<form id="formid">
    <select name="select" class="required">
        <option value="">Choose</option>
        <option value="child">test2</option>
    </select>

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

JavaScript

$("#formid").validate(); ​

デモ

于 2012-12-19T04:58:02.393 に答える
3

これはおそらく前述のメソッドのいくつかで機能しますが、カスタム検証関数を使用する場合は、 http：//docs.jquery.com/Plugins/Validation/Validator/addMethodに記載されているようにaddMethodを使用する必要があります。

したがって、最初に次のような方法でメソッドを追加します

$.validator.addMethod("requiredSelect", function(element) {
                return ( $("#select").val() !='-1' );
            }, "You must select an option.");

次に、バリデーターを次のように割り当てるだけです。

$("#formid").validate({
  rules: {
    select: { requiredSelect : true }
  }
});
于 2012-12-19T05:03:33.933 に答える
0

それ以外の：

$("#select").val()

試す：

$("#select :selected").val()

$("#select").val()選択したオプション値ではなく、すべてのオプション値を返します。

report-crimeここで、私の仮定は、コントロールが検証されるときにユーザーがオプション-1を選択したかどうかを確認したいということです。

于 2012-12-19T04:56:21.763 に答える
0

デフォルトでは

<option value="">Choose</option>

で動作します

required: true

于 2012-12-19T05:00:06.120 に答える
0

要素に属性がありません。nameselect私の場合、jQuery検証プラグインが検証中にnamenotを検索するため、これが問題でしたid。

于 2020-05-14T11:43:52.280 に答える
0

何らかの理由で、提供されたソリューションが私の場合は機能しませんでした。それは、ドロップダウンの値の「オプション」チェックを呼び出すjQuery Validateに要約され、これは！requiredルールを呼び出しました。

選択ボックスが空の値を選択した場合、requiredは「false」を示しました。これは、requiredが失敗したときに常にオプションであったことを意味するため、requiredはrequiredルールを実行しませんでした。

オプション関数を以下で上書きしました。これは、必須アイテムの場合、オプションで「False」を返しました。

// Get Select to work
    $.validator.prototype.optional = function (element) {
        var val = this.elementValue(element);

        // Custom logic to get Select to show validate when value is empty
        if (element.nodeName.toLowerCase() === "select") {
            if (element.hasAttribute("data-val-required") || element.hasAttribute("required")) {
                return false;
            }
        }

        return !$.validator.methods.required.call(this, val, element) && "dependency-mismatch";
    };
于 2020-06-27T04:06:23.087 に答える