55

さまざまなブラウザで日付ピッカーを使用して、可能な限り単純なシナリオを使用しようとしています。非常に単純なことを間違った方法で行っているのではないかと思いますが、何度も検索しても解決策が見つかりません。以下は、私が試みていることを表すサンプルコードです。

Chrome（v12.0.742.122）を使用して、2011年8月13日のようにピッカーから日付を選択した場合、形式を'dd / mm /として明示的に指定した場合でも、jQuery検証ロジックはページの送信を許可しません。 yy'。

形式を「dd/M / yy」に変更し、2011年8月13日のような日付を選択すると、Chromeで機能しますが、IE（v8.0.7600.16385）では送信されません。FireFox（v3.6.18）では、両方の形式が機能します。

Chromeで「dd/mm / yy」の日付形式をサポートできるようにするために必要な検証スクリプトは何ですか？

<html>
 <head>
  <link rel="stylesheet" type="text/css" href="jquery-ui.css" />
  <script type="text/javascript" src="jquery-1.4.4.js"></script>
  <script type="text/javascript" src="jquery.validate.js"></script>
  <script type="text/javascript" src="jquery.validate.unobtrusive.js"></script>
  <script type="text/javascript" src="jquery-ui.js"></script>
  <script type="text/javascript">
      $(document).ready(function () {
    $('.date').datepicker({ dateFormat: 'dd/mm/yy' });
            $.validator.addMethod("dateRule", function(value, element) {
      return true;
    },
    "Error message");
      });
  </script>
 </head>
 <body>
    <form>
        Date: <input type="text" name="myDate" class="date dateRule" />
        <input type="submit" />
    </form>
 </body>
</html>
4

12 に答える 12

53

4時間後、私はついに答えを見つけました。何らかの理由で、Chrome には、IE と FireFox が適切であり、OS の地域設定を使用できる米国の日付形式を使用する傾向が組み込まれているようです。

jQuery.validator.methods["date"] = function (value, element) { return true; }
于 2011-08-02T06:15:16.073 に答える
50

ここで入手可能な Globalize.js プラグインを使用できます: https://github.com/jquery/globalize

次に、Web サイトのメイン スクリプト ファイルで検証メソッドを次のように再定義します (jquery.validate.js ライブラリ ファイルは、後で更新する可能性があるため、編集しないでください)。

$.validator.methods.date = function (value, element) {
    return this.optional(element) || Globalize.parseDate(value, "d/M/y", "en");
}
于 2012-11-23T12:02:27.980 に答える
18

この問題はJQueryチームで発生したようです。

https://github.com/jzaefferer/jquery-validation/issues/153

今のところ回避策は、 additional- methods.jsでdateITAを使用することです。

次のようになります。

jQuery.validator.addMethod(
    "dateITA",
    function(value, element) {
        var check = false;
        var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
        if( re.test(value)){
            var adata = value.split('/');
            var gg = parseInt(adata[0],10);
            var mm = parseInt(adata[1],10);
            var aaaa = parseInt(adata[2],10);
            var xdata = new Date(aaaa,mm-1,gg);
            if ( ( xdata.getFullYear() == aaaa ) 
                   && ( xdata.getMonth () == mm - 1 ) 
                   && ( xdata.getDate() == gg ) )
                check = true;
            else
                check = false;
        } else
            check = false;
        return this.optional(element) || check;
    },
    "Please enter a correct date"
);

そのバリデーターを追加すると、datepickerを「.dateITA」クラスにアタッチできます。

これまでのところ、これはChromeのこのばかげた問題を乗り越えるためにうまく機能しました。

于 2011-11-02T05:53:33.280 に答える
2

私たちは以下を使用してプロジェクトに取り組みます。

if ($.validator) {
    $.validator.addMethod("date",
        function (value, element, params) {
            if (this.optional(element)) {
                return true;
            }

            var ok = true;
            try {
                $.datepicker.parseDate("dd/mm/yy", value);
            }
            catch (err) {
                ok = false;
            }
            return ok;
        });
}
于 2016-09-26T14:39:40.533 に答える
1

このコードが役に立ちますように。

$.validator.addMethod(
         "date",
         function(value, element) {
              var check = false;
              var re = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
              var reBR = /^\d{4}\-\d{1,2}\-\d{1,2}$/;
              if( re.test(value)){
                   var adata = value.split('/');
                   var gg = parseInt(adata[0],10);
                   var mm = parseInt(adata[1],10);
                   var aaaa = parseInt(adata[2],10);
                   var xdata = new Date(aaaa,mm-1,gg);
                   if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) )
                        check = true;
                   else
                        check = false;
              } else if( reBR.test(value)){
                   var adata = value.split('-');
                   var aaaa = parseInt(adata[0],10);
                   var mm = parseInt(adata[1],10);
                   var gg = parseInt(adata[2],10);
                   var xdata = new Date(aaaa,mm-1,gg);
                   if ( ( xdata.getFullYear() == aaaa ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == gg ) )
                        check = true;
                   else
                        check = false;
              } else
                   check = false;
                   console.log(check);
              return this.optional(element) || check;
         },
         "Por favor insira uma data válida"
    );
于 2016-12-13T20:47:11.427 に答える
0

また、どの文化でも機能するように見える解決策も見つけました。

http://devdens.blogspot.com/2011/11/jquery-validation-fix-for-date-format_29.html

実際の jquery.valdiation.min.js ファイルを変更する必要がありますが、今のところうまくいっています。

于 2012-09-19T15:57:12.330 に答える
0

これは私のために働いた唯一の解決策です: http://www.codeproject.com/Tips/579279/Fixing-jQuery-non-US-Date-Validation-for-Chrome

 jQuery.extend(jQuery.validator.methods, {
        date: function (value, element) {
            var isChrome = window.chrome;
            // make correction for chrome
            if (isChrome) {
                var d = new Date();
                return this.optional(element) || 
                !/Invalid|NaN/.test(new Date(d.toLocaleDateString(value)));
            }
            // leave default behavior
            else {
                return this.optional(element) || 
                !/Invalid|NaN/.test(new Date(value));
            }
        }
    });
于 2015-03-11T10:01:59.103 に答える
0

validate で定義する dateRule メソッドを次のように変更する必要があります (たとえば、正規表現は単なる単純なものです)。

$.validator.addMethod(
    "dateRule",
    function(value, element) {
        return value.match(/^\d\d?\/\d\d?\/\d\d$/);
    },
    "Please enter a date in the format dd/mm/yy"
);

必要に応じて正規表現を切り替えることができます。ここから、M/D/YY または M/D/YYYY または MM/DD/YYYY または MM/DD/YY をサポートする日付の正規表現を取得しました: 1920 年 1 月 1 日から 2019 年 12 月 31 日まで。2 月 29 日と 30 日は常に許可されます

^((0?[13578]|10|12)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[01]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1}))|(0?[2469]|11)(-|\/)(([1-9])|(0[1-9])|([12])([0-9]?)|(3[0]?))(-|\/)((19)([2-9])(\d{1})|(20)([01])(\d{1})|([8901])(\d{1})))$
于 2011-08-02T03:21:53.997 に答える
0

または、バリデーターを無視するのではなく、上書きしようとするかもしれません。

$.validator.addMethod("date", function (value, element) {
    var result = true;
    try {
        $.datepicker.parseDate('dd/mm/yy', value);
    }
    catch (err) {
        result = false;
    }
    return result;
});
于 2018-01-18T02:26:30.910 に答える