fakeraol: Input type=number mit großen Werten "funktioniert nicht"

Hallo,

Browser: Firefox 31.0

<input id="timestamp" type="number" step=86400 />  
<script type="text/javascript">  
var t = new Date().getTime();  
document.getElementById("timestamp").max=t;  
document.getElementById("timestamp").value=t;  
</script>

Zur Erklärung: Ich will ein Datum tageweise ändern (86400s = 1Tag). Im Firefox funktioniert das nicht, das Input-Element wird rot umrandet, ohne Fehlermeldung in der Console, und beim Click auf die Up-/Down-Pfeile passiert nichts, auch ohne Fehlermeldung.

Mach ich etwas falsch, oder ist das evtl. ein Bug im Firefox?

freundl. Grüße, Raik

  1. Hi,

    Ich will ein Datum tageweise ändern (86400s = 1Tag).

    Daß 86400s = 1 Tag an 2 Tagen des Jahres nicht gilt, ist Dir klar?

    Wenn Du sowieso nur tageweise ändern lassen willst, warum hantierst Du dann mit Sekunden statt Tagen?

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    O o ostern ...
    Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
    1. hallo Andreas,

      Daß 86400s = 1 Tag an 2 Tagen des Jahres nicht gilt, ist Dir klar?

      Nein?

      Wenn Du sowieso nur tageweise ändern lassen willst, warum hantierst Du dann mit Sekunden statt Tagen?

      Aus dem Timestamp lässt sich einfach das Datum erzeugen, ohne an Monatsgrenzen, etc. herumrechnen zu müssen. Ich wüsste aber auch gern, warum das so im Firefox nicht funktioniert. Ich hab meine Syntax mehrfachgeprüft und kann keinen Fehler finden.

      1. Hi,

        Daß 86400s = 1 Tag an 2 Tagen des Jahres nicht gilt, ist Dir klar?

        Nein?

        Zeitumstellung Winter-/Sommerzeit.

        Wenn Du sowieso nur tageweise ändern lassen willst, warum hantierst Du dann mit Sekunden statt Tagen?

        Aus dem Timestamp lässt sich einfach das Datum erzeugen, ohne an Monatsgrenzen, etc. herumrechnen zu müssen.

        Du kannst auf ein Date-Objekt auch einfach komplette Tage „draufaddieren“ (unter Zuhilfenahme von getDate und setDate) – wenn das über Monatsgrenzen hinaus gehen würde, kümmert sich Date automatisch darum das entsprechend zu korrigieren.

        MfG ChrisB

        --
        Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/
        1. Moin Moin!

          Daß 86400s = 1 Tag an 2 Tagen des Jahres nicht gilt, ist Dir klar?

          Nein?

          Zeitumstellung Winter-/Sommerzeit.

          Aber nur, wenn Du in lokaler Zeit rechnest statt zeitzonenunabhängig (UTC, UT1, TAI).

          Ansonsten galt 86400s = 1 Tag an bislang 25 Tagen (alle entweder 30. Juni oder 31. Dezember des jeweiligen Jahres) nicht. Ob das in Zukunft für einige Tage wieder nicht gilt, steht in den Sternen. ;-)

          Unix-Computern ist das herzlich egal, denn ihre Zeitdefinition wieselt sich um genau dieses Problem herum, und sie sehen eine Sekunde, in der das Licht im Vakuum fast 600.000 km zurücklegt.

          Alexander

          --
          Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so".
        2. Hallo Chris,

          Zeitumstellung Winter-/Sommerzeit.

          Stimmt, daran hab ich nicht gedacht.

          Du kannst auf ein Date-Objekt auch einfach komplette Tage „draufaddieren“ (unter Zuhilfenahme von getDate und setDate) – wenn das über Monatsgrenzen hinaus gehen würde, kümmert sich Date automatisch darum das entsprechend zu korrigieren.

          Danke für den Tip, das ist, glaub ich, die beste Lösung.

          netten Tag, raik

  2. Meine Herren!

    Zur Erklärung: Ich will ein Datum tageweise ändern (86400s = 1Tag).

    Hast du schon <input type="date"> in Erwägung gezogen?

    Im Firefox funktioniert das nicht, das Input-Element wird rot umrandet, ohne Fehlermeldung in der Console, und beim Click auf die Up-/Down-Pfeile passiert nichts, auch ohne Fehlermeldung.

    Überleg dir mal, wie die Attribute step, max und value zusammenspielen.
    Wieso macht das Folgende zum Beispiel wenig Sinn?
    step="3" value="2" max="10"?

    --
    “All right, then, I'll go to hell.” – Huck Finn
    1. Überleg dir mal, wie die Attribute step, max und value zusammenspielen.
      Wieso macht das Folgende zum Beispiel wenig Sinn?
      step="3" value="2" max="10"?

      Ja, warum "wenig Sinn"? Value kann max. 8 werden, was aber nicht zur Funktionsunfähigkeit des Input führen dürfte.

      1. Meine Herren!

        Überleg dir mal, wie die Attribute step, max und value zusammenspielen.
        Wieso macht das Folgende zum Beispiel wenig Sinn?
        step="3" value="2" max="10"?

        Ja, warum "wenig Sinn"? Value kann max. 8 werden, was aber nicht zur Funktionsunfähigkeit des Input führen dürfte.

        Nein value kann maximal 10 werden (max="10"). Aber value kann auch nur die Werte (…,-6,-3,0,3,6 und 9) annehmen (step="3"). step steht für die Schrittweite.

        --
        “All right, then, I'll go to hell.” – Huck Finn
      2. @@fakeraol:

        nuqneH

        Überleg dir mal, wie die Attribute step, max und value zusammenspielen.
        Wieso macht das Folgende zum Beispiel wenig Sinn?
        step="3" value="2" max="10"?

        Ja, warum "wenig Sinn"? Value kann max. 8 werden

        Nein. 9.

        was aber nicht zur Funktionsunfähigkeit des Input führen dürfte.

        Da hast du vermutlich recht. [HTML5]

        Qapla'

        --
        „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        1. Hallo Gunnar,

          Nein. 9.

          ??
          2 + 3 = 5 + 3 = 8 ?
          Wieso 9 ?

          Grüße, Raik

          1. @@fakeraol:

            nuqneH

            Nein. 9.

            ??
            2 + 3 = 5 + 3 = 8 ?
            Wieso 9 ?

            Weil beim ersten stepUp() nicht 2 + 3 gerechnet wird. Die entsprechende Stelle in de Spec hatte ich verlinkt – just in dem Posting, auf das du gerade geantwortet hast.

            Qapla'

            --
            „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
            1. Hi Gunnar,

              Wieso 9 ?
              Weil beim ersten stepUp() nicht 2 + 3 gerechnet wird. Die entsprechende Stelle in de Spec hatte ich verlinkt – just in dem Posting, auf das du gerade geantwortet hast.

              Dann macht es der Firefox falsch (gerade ausprobiert, Ergebnis:8), und unlogisch/mathematisch falsch wäre es auch. Ich hab die Stelle in den Specs auch nicht gefunden, auf die Du Dich beziehst.

              Ja, du misbrauchst type="number", wo du doch type="date" verwenden möchtest.

              Da ich das Datum im Format "7. August. 2014" ohne "Dekoration" (Rahmen und Buttons des Input[date]) benötige, und mit Input[date] auch mehr Clicks zur Auswahl nötig wären, ist das für mich schon die passende Lösung. (Viele Wege führen nach Rom.)

              Außerdem erschließt sich mir die Notwendigkeit der Teilbarkeit von Value durch Step nicht, da Aufgabe des Input[number]-Elements ja Addition/Subtraktion ist.
              Da werden neue Elemente in HTML eingeführt, und dann deren Verwendbarkeit unnötigerweise eingeschränkt. Wenn Chrome da unaufgefordert irgendwas rundet, ist er, bzw. die Spec. kaputt, weil das mathematisch falsch ist.

              In Deinem Beispiel ist 2 auch nicht durch 3 ganzzahlig teilbar, trotzdem funktioniert das Input in diesem Fall. Selbst ein Ergebnis mit periodischem Rest könnte man es näherungsweise angeben, statt ein kaputtes Input-Element darzustellen.

              einen angenehmen Tag wünscht
              Raik

              1. @@fakeraol:

                nuqneH

                Wieso 9 ?
                Weil beim ersten stepUp() nicht 2 + 3 gerechnet wird. Die entsprechende Stelle in de Spec hatte ich verlinkt – just in dem Posting, auf das du gerade geantwortet hast.

                Dann macht es der Firefox falsch (gerade ausprobiert, Ergebnis:8)

                Nee, er macht’s richtig. Chrome auch. Mein Fehler.

                Ich hab die Stelle in den Specs auch nicht gefunden, auf die Du Dich beziehst.

                “6. If value subtracted from the step base is not an integral multiple of the allowed value step, then set value to the nearest value that, when subtracted from the step base, is an integral multiple of the allowed value step, and that is less than value if the method invoked was the stepDown() and more than value otherwise.”

                Bedeutung von step base und allowed value step ist jeweils verlinkt. Und siehe da: step base ist in dem Fall nicht 0, da ja value gesetzt ist.

                Es geht also: 2 → 5 → 8.

                Was ist bei deinem Eingabeld nun anders? value wird nicht mit HTML, sondern (später) mit JavaScript gesetzt. Für die Berechnung von step base wohl zu spät, diese ist 0.

                Ersetze <input step="3" value="2" max="10"/> durch

                <input step="3" value="2" max="10"/>  
                <script>[code lang=javascript]document.querySelector('input').value = 2;
                ~~~</script>[/code]  
                  
                und Chrome verhält sich entsprechend Punkt 6: 2 → 3 → 6 → 9. Firefox versagt seinen Dienst; sollte er nicht.  
                  
                  
                Ich habe allerdings in der Spec nichts gefunden, warum ein Browser bei Änderung von value nicht step base neu berechnen sollte. Allerdings auch nicht, dass er das tun sollte.  
                  
                  
                
                > > Ja, du misbrauchst type="number", wo du doch type="date" verwenden möchtest.  
                >   
                > Da ich das Datum im Format "7. August. 2014" ohne "Dekoration" (Rahmen und Buttons des Input[date]) benötige  
                  
                Styling ist Sache von CSS. Statt eines menschenlesbaren Datums willst du einen Timestamp im Eingabefeld stehen haben, der sich aus für den Nutzer kaum nachvollziehbare Weise ändern soll?  
                  
                Qapla'
                
                -- 
                „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                
                1. Styling ist Sache von CSS. Statt eines menschenlesbaren Datums willst du einen Timestamp im Eingabefeld stehen haben, der sich aus für den Nutzer kaum nachvollziehbare Weise ändern soll?

                  Mit CSS kann ich die Darstellung des Input[date] nicht auf das benötigte Format ändern. Ich muß also sowieso ein zusätzl. Element (span) für die visuelle Ausgabe nutzen. Nutze ich Input[date], muß ich mangels Methode "getDate()" des Elements den Inhalt von Value auslesen, zerlegen, und neu zusammensetzen. Da ist das einfacher:

                    
                  <span id="datum">?</span><input id="kalender" type="number" value="0" onchange="setdate()">  
                  <script type="text/javascript">  
                  var d = new Date();  
                  var k=document.getElementById("kalender");  
                  var Monat = new Array("Januar","Februar","M&auml;rz","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember");  
                  function setdate(){  
                  	d.setDate(d.getDate()+Number(k.value));  
                  	k.value=0;  
                  	document.getElementById("datum").firstChild.data=d.getDate()+". "+Monat[d.getMonth()]+" "+d.getFullYear();  
                  	}  
                  setdate();  
                  </script>
                  

                  Das W2C kann natürlich in den Specs festlegen, was es will. Wenn ich aber ein Element benutze, das für mathematische Berechnungen gedacht ist, erwarte ich, daß es nach den bekannten mathematischen Regeln funktioniert. Auch wenn ich Value nachträglich per Javascript ändere, kann ich exakte Rechenergebnisse erwarten, und solange ich nicht den gültigen Zahlenbereich auf Ganzzahlen einschränke, hat bis auf Division durch Null jede Rechenoperation ein gültiges Ergebnis zu liefern, von mir aus mit einer default-Genauigkeit und max. Genauigkeit, aber ungefragt zu runden, oder gültige math. Operationen zu verweigern bedeutet in meinen Augen, daß die Spec./Implementation kaputt/Müll ist.

                  Fazit: Lösung/Workaround gefunden, Spec./Umsetzung in Firefox noch fehlerhaft.

                  Danke für die Hilfe, netten Tag, Raik

                2. @@Gunnar Bittersmann:

                  nuqneH

                  Ersetze <input step="3" value="2" max="10"/> durch

                  oops, das value-Attribut sollte weg:

                  <input step="3" max="10"/>  
                  <script>[code lang=javascript]document.querySelector('input').value = 2;
                  ~~~</script>[/code]  
                    
                  Qapla'
                  
                  -- 
                  „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
                  
  3. Moin,

    Browser: Firefox 31.0

    … vermutlich nicht nur der:

    <input id="timestamp" type="number" step=86400 />

    <script type="text/javascript">
    var t = new Date().getTime();
    document.getElementById("timestamp").max=t;
    document.getElementById("timestamp").value=t;
    </script>

      
    Nach meinem Test eben muss der Wert von step ein Teiler des value sein. Preisfrage: Wann ist das nur erfüllt?  
      
    Viele Grüße,  
    Robert
    
  4. @@fakeraol:

    nuqneH

    Zur Erklärung: Ich will ein Datum tageweise ändern (86400s = 1Tag). Im Firefox funktioniert das nicht, das Input-Element wird rot umrandet,

    Der Wert ist nicht zu groß. Es liegt ganz einfach daran, dass er nicht durch 86400 teilbar ist.

    Chrome korrigiert das, indem beim Click auf ▲/▼ die nächst höhere/niedrigere durch step teilbare Zahl genommen wird. Auch nicht das, was du willst.

    Mach ich etwas falsch

    Ja, du misbrauchst type="number", wo du doch type="date" verwenden möchtest.

    Qapla'

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)