5

別のフィールドの値が変更されたときに、あるフィールドで特定のjquery-unobtrusiveルールをトリガーする方法はありますか?

2つの日付フィールド(開始/終了など)があり、検証が。endより大きくなければならないフォームがありますstartendこれは、設定済みの後で変更するという単純なケースでは正常に機能しstartます。それがしないのは許可することです:

  • end最初に設定してから設定するstart
  • start両方がすでに設定された後に変更し、制約に違反する

サーバー側の検証はもちろんそれをキャッチしendますが、修正した後でも設定されたままのエラーstartがあるか、の値がend無効な値に変更されてもエラーが表示されないのは悪いことです。特定のルールをトリガーする理由は、ユーザーが値を入力する前に、同じフィールドでルールrequiredまたはフォーマットルールを実行したくないためです。dateフォームは「クリーン」から始まります。ただし、それが不可能な場合は、すべてのルールを実行しても問題ありません。

コードサンプルがないことをお詫びしますが、これからどこから始めればよいのかさえわかりません。

アップデート:

今のところ私が行ったことは、モデルを掘り下げて(これは、asp.net mvcプロジェクトであるため)、属性を見つけて、そのプロパティを直接読み取ることです。

var controllerCtx = ViewContext.Controller.ControllerContext;
var da = ViewData.ModelMetadata.GetValidators(controllerCtx)
            .SelectMany(x => x.GetClientValidationRules())
            .Where(x => x.ValidationType == "isdateafter")
            .FirstOrDefault();

var otherid = da == null ? "" : da.ValidationParameters["propertytested"];

次に、通常のHTML部分で、でテストを実行し、startそれが日付ピッカーであるかどうかを確認してから、基本的なチェックを接続し、すべての検証ルールを実行します。endルールはあまりないので、実行する前にフィールドに値があるかどうかを確認するだけです。以下の独創的なソリューションを使用したいと思います。今週少し自由な時間があれば、それを試してみます。

@if (otherid != "") {
    <text>
    var other = $("#@otherid");
    if (other && other.hasClass('hasDatepicker')) { // if the other box is a date/time picker
       other.datetimepicker('option', 'onSelect', function(dateText, instance) {
           var lowerTime = $(this).datetimepicker('getDate');
           $("#@id").datetimepicker('option', 'minDate', new Date(lowerTime.getTime()));
           if ($("#@id").val()) { // if there is a value in the other
                $('form').data('validator').element('#@id');
           }
        });
    }
    </text>
}
4

1 に答える 1

10

これはあなたのために働くかもしれません...

$('form').data('validator').element('#Key')

これにより、フォームからバリデーターが取得され、個々のアイテムの検証が強制されます。

http://docs.jquery.com/Plugins/Validation/Validator/element#element

アップデート

これが引き続き役立つかどうかを確認してください。

$.extend($.validator.prototype, {
        elementWithRule: function(element, rule) {
            element = this.clean(element);
            this.lastElement = element;
            this.prepareElement(element);
            this.currentElements = $(element);
            var result = this.checkSpecificRule(element, rule);
            if (result) {
                delete this.invalid[element.name];
            } else {
                this.invalid[element.name] = true;
            }
            if (!this.numberOfInvalids()) {
                // Hide error containers on last error
                this.toHide = this.toHide.add(this.containers);
            }
            this.showErrors();
            return result;
        },
        checkSpecificRule: function(element, rule) {
            element = this.clean(element);

            // if radio/checkbox, validate first element in group instead
            if (this.checkable(element)) {
                element = this.findByName(element.name).not(this.settings.ignore)[0];
            }

            var findRule = { },
                checkRule = $(element).rules()[ rule ];
            var rules;

            if (checkRule) {
                findRule[rule] = checkRule;
                rules = findRule;
            }

            if (!rules) {
                return;                
            }
            var dependencyMismatch = false;
            for (var method in rules) {
                var rule = { method: method, parameters: rules[method] };
                try {
                    var result = $.validator.methods[method].call(this, element.value.replace( /\r/g , ""), element, rule.parameters);

                    // if a method indicates that the field is optional and therefore valid,
                    // don't mark it as valid when there are no other rules
                    if (result == "dependency-mismatch") {
                        dependencyMismatch = true;
                        continue;
                    }
                    dependencyMismatch = false;

                    if (result == "pending") {
                        this.toHide = this.toHide.not(this.errorsFor(element));
                        return;
                    }

                    if (!result) {
                        this.formatAndAdd(element, rule);
                        return false;
                    }
                } catch(e) {
                    this.settings.debug && window.console && console.log("exception occured when checking element " + element.id
                        + ", check the '" + rule.method + "' method", e);
                    throw e;
                }
            }
            if (dependencyMismatch)
                return;
            if (this.objectLength(rules))
                this.successList.push(element);
            return true;
        }
    });

// Then use it like this...
$('form').data('validator').elementWithRule('#Key', 'required');

これを行うための組み込みの方法はないようだったので、私は何かを一緒にハックしました!:)

于 2012-05-16T15:36:40.747 に答える