4

「2012 年 2 月 14 日」の形式で日付をフィールドに入力する jQuery UI 日付ピッカーが添付された input type="text" を含むページがあります。偉大な。次に、モバイル/小さな画面に合わせてインターフェイスを調整する必要があります。iPhone ユーザーがテキスト入力をタップすると、jQuery 日付ピッカーが表示され、iOS にもネイティブのテキスト入力キーパッドが表示されるという問題があります。

Modernizr を使用して html5 inputtype=date の可用性を検出し、利用可能な場合は jQuery 日付ピッカーを無効にし、入力タイプを「日付」に切り替えて、これを理解するデバイスがネイティブ入力を使用できるようにしました。ただし、これはバックエンド システムが理解できない「2012-02-14」の形式で日付を入力します。「2012 年 2 月 14 日」という形式で到着する日付に応じて、多くの作業が行われています。

したがって、誰かが助けてくれるなら、jQuery UI の日付ピッカーのみをすべてのシステムに表示する方法、またはネイティブの日付/テキスト入力を強制的に「2012 年 2 月 14 日」の形式で入力できるようにする方法を探しています。

4

1 に答える 1

1

残念ながら、ユーザーのシステム設定に関連付けられているため、datepicker 形式をオーバーライドすることはできません。

実際にできることは、使用可能なテクノロジ (Modernizr.inputtypes.date など) に基づいて、スクリプトで type="text" から type="date" への動的な切り替えを行うことです。

そこから非表示フィールドを埋め込み、現在の日付フィールドの名前をその非表示フィールドに移行してから、ネイティブの日付ピッカーからの日付形式を目的の形式に解析し、その値を非表示フィールドに設定できます。

<input type="date" name="userSetDate"/>

これに：

<input type="date"/>
<input type="hidden" name="userSetDate" value="mm/dd/yyyy"/>

困難は、フォーマットのバリエーションのために、ユーザー定義のフォーマットを目的のフォーマットに解析することです。

10-06-13 --> 2013 年 10 月 6 日ですか、それとも 2013 年 6 月 10 日ですか?

これで、ラベルをボタンのようにスタイリングし、正確な [for] 属性を適用し、datepicker フィールドを type="hidden" にして、それに datepicker を適用するなど、最上位のソリューションを組み込むことができます。

<label for="fooDate">test</label>
<input type="hidden" name="fooDate" id="fooDate">

<script>
$('#fooDate').datepicker();
</script>

あなたが（これが投稿された日付に気づいた）理解できることを願っています！

于 2013-06-17T18:51:10.377 に答える