web-dev-qa-db-ja.com

剣道の日付ピッカーに最小日付の日付検証を行うにはどうすればよいですか？

私は次のコントロールを持っています：

@(Html.Kendo().DatePickerFor(model => model.Attributes.DueDate)
    .HtmlAttributes(new { 
        ID = "idSurvey_DueDate", 
        @data_bind = "value: DueDate", 
        @Class = "report-label datepicker surveyAttributesData", 
        TabIndex = 3 })
    .Min(DateTime.Now)                                                            
)

そして次のjquery：

$("#idSurvey_DueDate").kendoValidator({
    rules: {
        dateValidation: function (e) {
            var currentDate = kendo.parseDate($(e).val());
            // Check if date parse was successful
            if (!currentDate) {
                return false;
            }
            return true;
        }
    },
    messages: {
        dateValidation: "Invalid Date!",
        min: "Date must not be in the past!"
    }
});

これをテストして無効な日付を入力すると、表示されるメッセージが期待どおりではありません。代わりに、「フィールドDueDateは日付でなければなりません」です。このミステリーメッセージはどこから来ており、バリデーターに入力したmessagesプロパティを使用しないのはなぜですか？私が欲しいのは、無効な日付形式を許可せず、日付を過去にしないことだけです。したがって、最小値を適用する必要があります。

validationkendo-uikendo-asp.net-mvckendo-datepicker
8
hyprsleepy

このコードは正常に機能しているようです。

$("form").kendoValidator({
  rules: {
    dateValidation: function(element) {
      var value = $(element).val();

      var date = kendo.parseDate(value);
      if (!date) {
        return false;
      }

      return true;
    },
    minDate: function(element) {
      var value = $(element).val();

      var date = kendo.parseDate(value);

      var result = date >= new Date();

      return result;
    }
  },
  messages: {
    dateValidation: "You must enter a date",
    minDate: "The date must not be in the past"
  }
});

これがライブデモです： http://jsbin.com/EvoroRe/1/edit

8
Atanas Korchev

受け入れられた回答以降に剣道バリデーターが変更されたかどうかはわかりませんが、フィルターを除外して、日付ピッカー入力にのみ日付検証を適用する必要があります。そうしないと、テキストボックスまたはその他の入力によって、無効な日付に関するエラーメッセージが生成されます。ルールは次のようになります

$("#modForm").kendoValidator({
    rules: {
        dateValidation: function (input) {
            if (input.is('[data-role="datepicker"]')) {
                var value = $(input).val();

                var date = kendo.parseDate(value);
                if (!date) {
                    return false;
                }
            }
            return true;
        }
    },
    messages: {
        dateValidation: "You must enter a date",
    }
});
0
BurnsBA

mvcdateルールを追加することをお勧めします。

rules: {
    mvcdate: function (input) {
        var datarole = $(input).data('role');
        if (datarole === 'datepicker') {
            var value = $(input).val();
            if (value) {
                var date = kendo.parseDate(value, 'ddd, MMM d');
                if (!date) {
                    return false;
                }
            }
        }

        return true;
    }
},
messages: {
    mvcdate: function (intput) {
        return intput.attr('data-val-date');
    }
}

残念ながら、dateValidationルールの優先度はdateおよびmvcdateよりも低くなっています。これは、これらがデフォルトであり、カスタムルールでもないためです。私が理解したように、mvcdateルールが最も優先されます。

  • dateValidationルールが特定のコントロールでスキップされ、「日付である必要があります」というエラーが発生しました
  • dateルールがTRUEの結果で渡されましたが、それでも「日付である必要があります」というエラーが発生します
  • mvcdateルールは私だけを助けてくれました。

コンソールでいつでもkendoValidatorを確認できます。

kendoValidator debugger

0
Sergey G.