Vergleich von Zeiten

  • Hallöchen :D


    ich sitze seit einer Woche an dem Kalender und komme nicht voran. Also, das ganze soll wie folgt funktionieren:

    Ein Kunde wählt sein Essen aus, wird auf diese Seite weitergeleitet und entscheidet nun, ob er sein Essen abholen oder liefern lassen möchte.


    1. Problem: klickt der Kunde auf eine Uhrzeit im Bereich "Abholen", dann kann er gleichzeitig auch auf die Uhrzeiten im Bereich "Liefern lassen" klicken. Ich habe versucht unten die Ausgabe "Ihre ausgewählte Uhrzeit: ... " ausblenden zu lassen, je nachdem in welchem Feld der Kunde rumklickt. Ich habe es wie folgt versucht "falls ... dann disable .. ansonsten enable" aber es hat nicht funktioniert, habe den code komplett gelöscht, weil ich es nochmal neu versuchen wollte. Über Tipps würde ich mich wirklich sehr freuen!


    2. Problem: im Bereich Abholen werden verschiedene Uhrzeiten angezeigt, Ziel ist es, die vergangenen Uhrzeiten automatisch durchstreichen zu lassen. Ich habe versucht die Werte in einen String zu konvertieren usw. usf. :S nichts hat funktioniert, wäre das ganze leichter wenn ich die Uhrzeiten mit der DB verbinde oder reicht JS?


    zu Problem numero 2 habe ich einiges ausprobiert und wieder gelöscht, das einzige was übrig ist:


    und


    bin über Tipps, Hilfestellungen sehr dankbar!

    (Praktikum, WebAnw2, HS - Sem. 4)

  • Vorab: ich würde das html tag<input type="time">

    nutzen. Das ist aus Entwickler Sicht einfacher und lpasst sich auch automatisch den Gegebenheiten des Nutzers an.


    Also ich würde das jeweils andere gänzlich ausbleden/weglassen. Ich habe etwas ähnliches programmiert und frage bereits im Vorfeld ab, ob abgeholt oder geliefert werden soll. Je nach dem welche Option angeklickt wird, sollte auch nur der richtige Container angezeigt werden.


    Aber wenn du es so haben willst, wie es derzeit ist, ist das natürlich auch möglich. Wenn du das "Time Input" verwendest, lässt sich das auch tatsächlich disablen. <ul> Tags lassen sich nicht disablen.

  • Oder du machst es etwas kompakter mit 2 Slidern:


    Könnte dann z.B. so aussehen:

    Beispiel.jpg


    Slider 1 hat die Range 13-19, jeweils in 1er Schritten.

    Slider 2 hat die Range 00-45, jeweils in 15er Schritten.

    Mit Javascript kannst du dann ganz einfach die Uhrzeit bei einer Veränderung anpassen.

    Das fieldset der jeweils anderen Option kannst du dann auch bequem diablen.