スライダーなしの時間選択。
Railsでデフォルトの日時ピッカーを使用しています。私の目的のために日がめったに変更されることはないので、私は主にこれの時間的側面に焦点を合わせています。時間の選択をもう少しエレガントにする何らかの方法を探しています。スライダーはなるべく避けたいです。どんな提案も素晴らしいでしょう。
タイムピッカーに特に関心がある場合は、 Maxime Haineault's の実装が適切です。時間の選択手順を最小化して、シングルクリックします。
直接値を入力できれば、個人的にはとても快適です。これを念頭に置いて、自然な入力を非常に快適に受け入れる興味深い datejs プロジェクトがあります。
これらのSOこのトピックに関するディスカッションをフォローすることもできます： https://stackoverflow.com/questions/1245245/jquery-date-time-picker および https://stackoverflow.com/questions/476822/jquery-time-picker
今日も同じニーズに遭遇し、 KendoUIのDateTimePickerウィジェット を見つけました。これは良いインスピレーションをもたらします。
同じフィールドで日付ピッカーと時間ピッカーを組み合わせています。アイコンからアクセスできます。日付ピッカーはフィールドの上に表示され、時間ピッカーはフィールドの下に表示されます。
日付と時刻の選択部分は次のようになります。
編集：
このテーマに関する研究を続けると、 TelerikのWPF DateTimePicker や Mobiscroll javascript library （特にWindowsに触発された timepicker）のような他の可能なアプローチが見つかりました電話UI ）。
最も革新的なアプローチの1つは Dave Cortrightからのこの提案 ：
カレンダーアプリ（iOSで利用可能）のアプローチが気に入っています。デフォルトでは、このビューが表示されます（スクリーンショットの下部に焦点を当てています）：
単分精度は使用できません。しかし、多くのアプリケーションでは、それは受け入れられると思います。私は選ばれた時間の分割が好きです。 AM/PM範囲ではなく、上のバーには昼間の時間が含まれ、下のバーには夜間の時間が含まれます。この唯一の奇妙な結果は、0：00から07:00の配置です。 20:00から23:00の範囲の直後ですが、その前の時刻を表しています。 3つのバーのバリエーション（空のパーツが含まれている）はより明確になりますが、視覚的に魅力的ではありません。
[日付]ボタン（または[終日]ボタン）をクリックすると、ビューが次のように変わります。
もちろん、これはすべてウェブサイトではなく、iOSアプリ内のものです。しかし、あなたはオンラインで同様のアプローチを使うかもしれません、と私は思います。
通常のドロップダウンカレンダーとユーザーが自分で時間を入力できるようにすること、およびモバイルデバイスのドロップダウンに対応する必要がある場合はフォールバックを組み合わせることをお勧めします。 jQuery UI Datepicker のように、すぐにドロップダウンできるドロップダウンカレンダーはたくさんあります。良いカレンダーは、親しみやすく、優雅に低下します。
もちろん、時間に関しては、1つの単純なテキストボックスで十分です。より洗練された代替案は、結合されたボックスを持つことです これは簡単な例です 。
ここには興味深い、斬新な答えがたくさんありますが、もっと簡単な方法で問題を解決できると思います。
一部の有名なサービスは、時間に組み合わせのテキスト入力/ドロップダウンを使用し、同様のテキスト入力/カレンダーピッカーを使用します日付。
これにより、ユーザーはオプションのリストから選択するか（マウスユーザーの場合はクイック、精度が低い）、正確な値を入力できます（精度の高い、キーボードユーザーの場合は高速）。
最も重要なことは、ユーザーはおそらくこのパターンに精通しているでしょう:)覚えておいてください ユーザーに考えさせないでください ！
Googleカレンダー：
Zipcar：
