Validierung des Datum-Formats beim Formular-Feldtyp "Kalender"

  • Hallo zusammen,


    Ich teste gerade mit dem Standrad-Formular-Feldtyp "Kalender" herum.

    Bei diesem Feldtyp ist es ja so, dass ein bestimmtes Datumsformat definiert werden kann. Einmal definiert muss dieses Datumsformat eingehalten werden, ansonsten werden unstimmige Daten bei submit abgespeichert.


    Beispiel:

    Dieses Formularfeld wurde mit folgender Definition in der XML erstellt

    Code
    <field name="birthday" class="inputbox" format="%d.%m.%Y" timeformat="24" filter="user_utc" translateformat="false" showtime="false" singleheader="false" todaybutton="false" weeknumbers="false" filltable="false" type="calendar" label="COM_ATTLIST_BIRTHDAY" description="COM_ATTLIST_FORM_BIRTHDAY_DESC" hint="DD.MM.YYYY"/>


    Wenn der Kalender-Button benutzt wird, um das Datum einzugeben klappt alles prima. Wird das Datum manuell im gewünschten Format z.B 01.10.1998 eingegeben entsteht auch kein Problem. Wenn jedoch das Datum manuell in einem anderen als dem vorgegebenen Format eingegeben wird z.B 1998-10-01, so wird das Datum beim absenden des Formulars ohne Rückmeldung in 21.03.2007 (21.März 2007) umgewandelt und auch so gespeichert.


    Gibt es eine Möglichkeit eine Validierung zu diesem Feldtyp hinzuzufügen, damit falsche Datumsformate erkannt werden?

    Am liebsten hätte ich, dass das Formular nicht abgesendet und das Feld rot markiert wird, wenn ein falsches Datumsformat im input-Feld erkannt wird.


    Wäre schön, wenn es einen Joomla-Way-Of-Doing-It gäbe und ich diese Validierung nicht selber von Hand coden müsste...


    Lg Manuel

  • ich denke das einfachste wird eine validation rule wie diese hier sein: https://github.com/joomla/joom…orm/Rule/CalendarRule.php


    Wenn ich das richtig sehe checkt der aber noch nicht das format, müsste man bauen und als PR einreichen.

  • Es gibt noch die JS-Validierung, die funktioniert aber nicht, wenn jemand JS im Browser deaktiviert :-)


    Ich habe für meine Erweiterung dazu einen Layout-Override gemacht und https://momentjs.com/ eingebunden. In deine XML kannst du dann die Klasse validate-WHATEVER einfügen und im Layout-Override die Validierung implementiert.


    In meinem Fall ist WHATEVER=dateformat. Ist für das JS wichtig und sollte gleich heissen ;-)
    Siehe auch https://docs.joomla.org/Client-side_form_validation


    In diesem JS validiere ich dann die gewünschten/erlaubten Formate: https://github.com/JoomTools/p…dateDateFormat.js#L13-L32


    zero24 Danke, auf die Rule hatte ich noch garkeinen Focus.

    Vielleicht kann ich da einen Fix machen. Würde jedenfalls Sinn machen.

  • Elfangor93 ich konnte das Problem auf dieses JS zurückführen: https://github.com/joomla/joom…/gregorian/date-helper.js

    Meine JS Kenntnisse sind aber nicht gut genug, um das zu fixen.
    Vielleicht kannst du dazu einen Issue auf Github aufmachen? https://github.com/joomla/joomla-cms/issues


    Für die serverseitige Validierung hätte ich schon eine Lösung, weiss nur noch nicht wie man das Testen soll (für den PR).

    Die serverseitige Validierung würde auch nur Greifen, wenn das Formular mit deaktiviertem JS abgesendet würde.

  • Nach vielem heumprobieren habe ich mich nun entschieden, statt mit

    Code
    JForm::renderField('birthday')

    das Formularfeld mit einer eigenen Methode zu generieren. So ist es mir möglich für das Datumsfeld das offizielle HTML5 <input type="date"> zu verwenden. Dabei wird der date picker vom Browser bereitgestellt und ebenso vom Browser sichergestellt, dass das Datum im richtigen Format vorliegt.
    Die date picker von Desktop-Browsern sind zwar etwas weniger "schön" als der date picker vom Joomla-Formfeld "calendar", auf dem Moblie sind diejenigen vom Browser jedoch viel eleganter und intuitiver zu bedienen.


    Mit der eigenen Methode ist es mir also möglich ein wie folgt definiertes Formularfeld vom Typ Kalender als offizielles <input type="date"> Element auszugeben.

    Code
    <field name="birthday" class="inputbox" format="%Y-%m-%d" type="calendar" label="COM_ATTLIST_BIRTHDAY" description="COM_ATTLIST_FORM_BIRTHDAY_DESC" hint="DD.MM.YYYY" maxyear="-5" required="true" autocomplete="false"/>


    Folgend die Methode (definiert in der view.html.php der component-view):


    Bis jetzt hat sich diese Variante in den Tests gut bewährt. Einziger Nachteil: Die date picker des Elemets <input type="date"> lassen sich leider mit CSS nicht anpassen...


    Falls jemand noch eine andere gute Idee hat dieses Problem zu lösen, bin ich offen für Anregungen.


    Lg

    Manuel

  • Vielleicht kannst du dazu einen Issue auf Github aufmachen? https://github.com/joomla/joomla-cms/issues


    Für die serverseitige Validierung hätte ich schon eine Lösung, weiss nur noch nicht wie man das Testen soll (für den PR).

    Was sind die Gründe von Joomla ein <input type="text"> Element für das Formularfeld "calendar" zu verwenden?
    Wäre es stattdessen nicht sinnvoller ein PR einzureichen, um das <input type="text"> Element mit einem <input type="date"> Element zu ersetzen für das Kalender-Formularfeld?

  • Was sind die Gründe von Joomla ein <input type="text"> Element für das Formularfeld "calendar" zu verwenden?
    Wäre es stattdessen nicht sinnvoller ein PR einzureichen, um das <input type="text"> Element mit einem <input type="date"> Element zu ersetzen für das Kalender-Formularfeld?

    Keine Ahnung, das könntest du in deinem Issue erfragen, aber wahrscheinlich, weil man sonst den Browser-Kalender nicht so gut an die unterschiedlichen Anforderungen anpassen kann?

  • Oder weil damit keine Zeit auswählbar ist?
    Mit dem Element <input type="datetime-local"> wäre auch die Zeit wählbar, jedoch ist dieses Element noch nicht von allen Browsern unterstützt...

    Mal schauen, was die Zeit bringt.