0

日付を設定するフィールドがあります。このフィールドは、YYYYMMDD 形式のデフォルト値を持つことができ、オペレーターが理解できる正しい形式 DD.MM.YYYY に変換されます。理由は聞かないでください。これは古いシステムであり、大きなバックエンドを使用しているため、書き直すことはできません。

これらのフィールドに単純な日付ピッカーを追加するだけです。私は、この特定のタスクに十分軽量でシンプルな Pikaday を選択しました。私の典型的なユースケースは次のようになります。

<input type="text" id="datepicker" value="20150515" customType="date">
<img src="img/icon.gif" id="datepicker-button" />

<link rel="stylesheet" href="css/pikaday.css">
<link rel="stylesheet" href="css/site.css">
<script src="js/moment.min.js"></script>
<script src="js/pikaday.js"></script>
<script>
    var picker = new Pikaday(
    {
        field: document.getElementById('datepicker'),
        trigger: document.getElementById('datepicker-button'),
        firstDay: 1,
        yearRange: [1900,2020],
        onSelect: function() {
            var date = document.createTextNode(this.getMoment().format('DD.MM.YYYY') + ' ');
            document.getElementById('selected').appendChild(date);
        }
    });
    field.parentNode.insertBefore(picker.el, field.nextSibling);
</script>

元のコードは input タグです。残りは、私の新しい日付ピッカー機能です。

そして今、問題は何ですか。問題はデフォルト値です。デフォルト値が 20151023 だとしましょう。customType 属性は 2015 年 10 月 23 日の正しい日付を作成する必要がありますが、次の Pikaday スニペットは 20.03.1023 の日付を作成します。どうしてか分かりません。私はJavaScriptをよく理解していませんが、onSelectパラメータは、ユーザーが日付ピッカーボタンをクリックした場合にのみ呼び出される一種の匿名コールバック関数だと思います.

何か提案はありますか？

ありがとう、ジクラ

編集：

別の問題があるようです。バックエンドから値が来る場合、それは 20151023 のような値の形式です。また、値を解析して適切な形式 23.10.2015 を作成する関数を含む古い JavaScript ファイルがあります。問題は、私の Pikaday コンストラクターがその古代のパーサーの前に呼び出されていることです。私が jazZRo による有望なスニペットを使用して Pikaday 呼び出しの前に値を変更した場合でも、その古いパーサーは YYYYMMDD 形式を想定しているため、びっくりします。したがって、必要なのは、古代のパーサーの後に自分のものを呼び出すか、Pikaday コンストラクターで onSelect コールバック関数を禁止して、ページの読み込み時に実行しないようにすることです。

それは可能ですか？

4

1 に答える 1

0

最も簡単な解決策は、momentjs を使用して、Pickaday で使用される前に入力の値を変換することです。

(function() {
    var moment = window.moment(document.getElementById('datepicker').value, 'DDMMYYYY');
    document.getElementById('datepicker').value = moment.format('YYYY-MM-DD');
})();

http://jsfiddle.net/05fyr368/3/を参照してください

于 2015-10-23T12:46:47.643 に答える