Flatpickrを使用して最小限の日時入力選択を作成する

作成するのが最も難しいフィールドの1つです。 日付/時刻を選択. 開発者は月/日/年の簡単な選択メニューに頼るか、仕事をするために様々なプラグインに頼ります.

選択フィールドはうまく機能しますが、少し不格好です。代わりに、あなたはあなたのフォームを次のようにジャズアップすることができます。 Flatpickrプラグイン. それは 依存関係のない無料のオープンソースJavaScriptカレンダーピッカー.

そうだった ミニマリズムを念頭に置いて設計されています, だからそれはあらゆるWebサイトのレイアウト、あらゆるWebフォームに収まることができ、そしてどんな近代的な装置からも使えるはずです.

このプラグインの良いところは、 さまざまなカスタムオプション. テキストフィールドの日付の表示方法とカレンダーの開始位置を変更できます（デフォルトは “今日”）.

しかし、あなたもできる 厳密に日付ピッカーとして使用する 時間を選択する必要がない場合これは、この1つのピッカーを使ってフォームを介してより多くのデータを渡すことを可能にする単なるオプション機能です.

を見てください。 例のページ Flatpickrの動作を見る.

あなたもすることができます ターゲットを絞ったオプションを設定する 次のように、日付ピッカーの動作を制限します。

オプションは事実上無限であり、それらはすべてこの1つのバニラJavaScriptプラグインを通して機能します.

モバイルユーザーはネイティブの日付選択を好むことがよくありますが、できます。 これをJavaScriptのモバイル設定で上書きします. これにより、すべてのデバイスで同じインターフェースを使用できます。.

そして、あなたもすることができます polyfillでIE9サポートを追加する これは、最もよくサポートされている日付ピッカープラグインの1つです。.

インストールは簡単です npm、Bower、Yarnのコマンド. または、ソースファイルをダウンロードすることもできます GitHubから直接 あなたがそのルートを好む場合.

あなたが知る必要があるすべてはあなたを示すセットアップページで見つけることができます ヘッダにファイルを追加する方法 ＆ どのフィールドでこの日付ピッカーを呼び出すか. どのデザインにも合うように設計された、簡単に設計された、最高の日付ピッカープラグインの1つ.