Achot: HTML 5: date & time

Hallo,

ich dachte, ich könnte auf einen jQuery UI Kalender verzichten und mein Kalender über

<label for="aufbaudatum">Aufbaudatum  </label>
<input type="date" name="aufbaudatum" id="aufbaudatum" value="" required="">

realisieren. Aber leider bin ich einem besseren belehrt worden. Der Firefox und Safari spielen leider nicht mit. Das gleiche gilt bei der Uhrzeit

<label for="aufbauzeit">Aufbauzeit </label>
<input type="time" name="aufbauzeit" id="aufbauzeit" value="" required="">

Gibt es eine andere alternativ? Oder muss ich doch wieder auf den jQuery UI Kalender zurückgreifen? Beim Kalender wäre dieses noch OK, allerdings finde ich keine Lösung bei jQuery UI für die Uhrzeit.

  1. Hallo Achot,

    ich dachte, ich könnte auf einen jQuery UI Kalender verzichten und mein Kalender über

    <label for="aufbaudatum">Aufbaudatum  </label>
    <input type="date" name="aufbaudatum" id="aufbaudatum" value="" required="">
    

    realisieren. Aber leider bin ich einem besseren belehrt worden. Der Firefox und Safari spielen leider nicht mit.

    Noch nicht, bei Firefox geht das ab Version 54, bei Safari scheint man das noch nicht zu wissen.

    <label for="aufbauzeit">Aufbauzeit </label>
    <input type="time" name="aufbauzeit" id="aufbauzeit" value="" required="">
    

    Gibt es eine andere alternativ? Oder muss ich doch wieder auf den jQuery UI Kalender zurückgreifen? Beim Kalender wäre dieses noch OK, allerdings finde ich keine Lösung bei jQuery UI für die Uhrzeit.

    Eine Alternative ohne JavaScript? Nein, die wird es nicht geben, außer das Datum von Hand einzugeben, aber das ist wahrscheinlich keine Alternative.

    Eine Alternative mit JavaScript zu jQuery? Einfach mal nach „polyfill <gewünschte HTML5-Funktion>“ suchen.

    Gruß
    Julius

    1. @@Julius

      Eine Alternative ohne JavaScript? Nein, die wird es nicht geben, außer das Datum von Hand einzugeben, aber das ist wahrscheinlich keine Alternative.

      Unwahrscheinlich, dass es keine wäre.

      LLAP 🖖

      --
      “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
      1. Hallo,

        Unwahrscheinlich, dass es keine wäre.

        doch, es ist KEINE Alternative. Auch wenn dir es nicht passt, nimm es einfach so hin und starte keine endlose Diskussion.

        1. Hallo Achot,

          Unwahrscheinlich, dass es keine wäre.

          doch, es ist KEINE Alternative. Auch wenn dir es nicht passt, nimm es einfach so hin und starte keine endlose Diskussion.

          Ich glaube, wir haben hier einfach nur ein Missverständnis:

          • Ich meinte (und du vermutlich auch): Keine Alternative, die du gut finden wirst.
          • Gunnar meint (vermutlich): Es ist eine mögliche Alternative.

          Gruß
          Julius

          1. Hallo Julius,

            Ich glaube, wir haben hier einfach nur ein Missverständnis:

            das kann natürlich sein :)

            • Ich meinte (und du vermutlich auch): Keine Alternative, die du gut finden wirst.

            Genau, für mich gibt es keine andere Option, da meine User sich dieses wünschen und ich auf falsche Eingaben gerne verzichten kann.

            • Gunnar meint (vermutlich): Es ist eine mögliche Alternative.

            Ok, da hat er natürlich recht.

            1. Genau, für mich gibt es keine andere Option, da meine User sich dieses wünschen und ich auf falsche Eingaben gerne verzichten kann.

              • Gunnar meint (vermutlich): Es ist eine mögliche Alternative.

              Gegen Fehleingaben kannst Du Dich mit einem Pattern schützen. Gunnar hat vor einiger Zeit sogar mal eins für Datumseingaben gezeigt - da ist die Zeit nun gar kein Problem ;-)

              Rolf

              1. Hallo Rolf b,

                Gegen Fehleingaben kannst Du Dich mit einem Pattern schützen. Gunnar hat vor einiger Zeit sogar mal eins für Datumseingaben gezeigt - da ist die Zeit nun gar kein Problem ;-)

                Serverseitig muss man das sowieso noch validieren, das sollte man nicht vergessen.

                Damit der Nutzer das richtig eingibt, musst du es ihm ggf. erklären. Bei einer Uhrzeit gibt es (hierzulande) noch relativ wenig Möglichkeiten, ein Datum könnte man (auch in unserer Gegend) anders angeben. In anderen Regionen sortiert man aber die Angaben auch gerne anders herum, sodass das nicht eindeutig ist – von daher sind die neuen Eingabefelder-Typen schon ganz praktisch...

                Gruß
                Julius

    2. Hallo,

      Eine Alternative mit JavaScript zu jQuery? Einfach mal nach „polyfill <gewünschte HTML5-Funktion>“ suchen.

      danke, ich bleiben dann wohl bei:

      1. https://fgelinas.com/code/timepicker/
      2. https://jqueryui.com/datepicker/
  2. @@Achot

    ich dachte, ich könnte auf einen jQuery UI Kalender verzichten und mein Kalender über

    <label for="aufbaudatum">Aufbaudatum  </label>
    <input type="date" name="aufbaudatum" id="aufbaudatum" value="" required="">
    

    realisieren.

    Kannst du.

    Der Firefox und Safari spielen leider nicht mit.

    Firefox wird demnächst einen Datepicker haben. Im 53er Nightly Build schon da.

    Safari auf iOS hat einen Datepicker. Bei Safari auf macOS gibt’s demnächst eine neue Version; weiß jetzt aber nicht, ob da ein Datepicker dabei ist.

    Gibt es eine andere alternativ?

    Progressive enhancement verstehen.

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
    1. Hallo,

      Kannst du.

      nein kann ich eben nicht, da DERZEIT nicht alle relevanten Browser dieses so umsetzten wie ich es mir vorgestellt habe. Was in ein paar Wochen, Monaten oder gar Jahre ist, wissen wir alle nicht.

      Progressive enhancement verstehen.

      Das hat mir verstehen NICHTS zu tun. Auch wenn du dieses jetzt bestimmt wieder anderes siehst. Wenn meine User sich so eine Option wünschen dann bekommen sie diese auch. Warum soll ich ständig Fehleingaben korrigieren wenn ich zu faul bin etwas einzusetzen was in allen Browsern geht.

      1. Hallo Achot,

        klar kannst du darauf zurückgreifen! Du musst halt nur für die Browser, die das noch nicht beherrschen, einen Polyfill einbauen, wenn du nicht auf type="text" zurückfallen willst. Dadurch, dass du date und time bereits einsetzt, brauchen Browser, die das bereits können, kein Polyfill.

        Gruß
        Julius

        1. Hallo Julius,

          klar kannst du darauf zurückgreifen! Du musst halt nur für die Browser, die das noch nicht beherrschen, einen Polyfill einbauen, wenn du nicht auf type="text" zurückfallen willst. Dadurch, dass du date und time bereits einsetzt, brauchen Browser, die das bereits können, kein Polyfill.

          ist schwer einzubauen: https://github.com/jcgertig/date-input-polyfill.

          Was ist denn, wenn ich bei type="date" bleibe und zusätzlich den jQauery UI Datepicker einsetzte? Kann ich dann sagen Browser die date unterstützen nehmen eben date, die es nicht können greifen auf die UI zurück?

          1. Hallo Achot,

            Was ist denn, wenn ich bei type="date" bleibe und zusätzlich den jQauery UI Datepicker einsetzte? Kann ich dann sagen Browser die date unterstützen nehmen eben date, die es nicht können greifen auf die UI zurück?

            Das Vorhandensein von date- und time-Unterstützung im Browser müsstest du in JavaScript überprüfen können (frag mich nicht wie, dafür habe ich von JavaScript/DOM zu wenig Ahnung...) und dann ggf. den jQuery UI Datepicker laden.

            Gruß
            Julius

  3. ...allerdings finde ich keine Lösung bei jQuery UI für die Uhrzeit.

    Mal abgesehen von HTML-5 Input Elementen, ist hier nichts für Dich dabei, falls Du bei jQuery bleiben willst?

    Rolf