[JS] getoonde input value anders dan obj.value

[orf]

Ik wil een input type=text laten werken als een input type=date. Als een input date niet wordt ondersteund, gebruikt de browser een input type=text, maar het gedrag van die twee verschilt.

De spec voor een input type=date is als volgt:

- De weergegeven date (value) moet zoals de locale (lang attribute)
- Als je de value ophaalt (obj.value) moet de value in ISO 8601 (YYYY-MM-DD)
- Als je de value set moet dit in ISO 8601
- De POST of GET value moet in ISO 8601

Stel ik heb deze HTML met de nl-NL locale:

HTML:

<input lang="nl-NL" value="2012-11-07">

Dit moet weergegeven worden als "7-11-2012".

Ik kan getters en setters overschrijven met Object.defineProperty in Javascript, maar dan werkt de input niet goed meer wanneer je bijvoorbeeld de value zelf in de input intypt.

HTML:

<input id="date" lang="nl-NL" value="2012-11-07">

Moet weergegeven worden als 7-11-2012.

JavaScript:

document.getElementById('date').value

Moet 2012-11-07 returnen.

JavaScript:

document.getElementById('date').value = '2012-11-07'

Moet opnieuw 7-11-2012 weergeven in de input.



Iemand een oplossing die bovenstaand gedrag oplevert? Ik wil met deze functionaliteit verschillende browsers (die wel of niet input type=date ondersteunen) hetzelfde gedrag laten vertonen.

[MueR]

Kijk eens in de honderden datepickers die er op het web rond zweven?

[orf]

Eh, nee? Die vertonen dit gedrag helemaal niet.

[crisp]

Er zal vast wel een shim voor zijn

[orf]

crisp schreef op donderdag 29 augustus 2013 @ 16:22:
Er zal vast wel een shim voor zijn

Daar zoek ik juist naar.
Of begrijp ik je niet goed en bedoel je iets als html5shim?

[crisp]

Als ik even zoek op 'input date shim' dan vind ik zo al een aantal oplossingen. Het meest eenvoudig is natuurlijk om door middel van feature-detectie te kijken of een browser het input type al dan niet ondersteund. Indien dat niet het geval is kan je er natuurlijk zelf een behaviour aan toekennen, maar er zijn volgens mij ook zat libraries/plugins die dat voor je doen en proberen zo goed mogelijk het juiste gedrag van type=date te benaderen.

Wat het handigst is voor jouw situatie kan ik zo natuurlijk niet zeggen.

[orf]

Ik wil het gedrag voor elkaar krijgen wat ik hierboven beschrijf. Ik heb geprobeerd dit zo compleet mogelijk te beschrijven en in mijn vele google tochten heb ik geen directe oplossing kunnen vinden.

Ook met het zoeken naar "input date shim" vind ik niet iets.

Om het nogmaals te omschrijven:

Ik wil dat bij een input met de waarde "29-08-2013" de getter "2013-08-29" oplevert. Dat zie ik nergens gebeuren. Niet in plugins of libraries. Als je een voorbeeld hebt van een plugin of library die dit wel doet? Graag!


Edit:

Bijvoorbeeld op deze site: http://afarkas.github.io/webshim/demos/demos/webforms.html
Als je de datum "29-08-2013" intypt bij het date-field en de value opvraagt in Firefox (obj.value) krijg je "29-08-2013". Doe je precies datzelfde in Chrome krijg je "2013-08-29". Dat is wat ik consistent wil krijgen en ik probeer daar een universele library voor te schrijven waarmee je in beide gevallen gewoon de value op kunt vragen.

[ Voor 29% gewijzigd door orf op 29-08-2013 17:00 ]

[BasieP]

Volgens mij is (bijvoorbeeld) de jquery datetime picker, gewoon universeel (lees: in elke browser geeft hij in hetzelfde formaat zijn data terug). Echter botst die met de html 5 variant.

Verder zijn er wel meer datetime pickers, maar wanneer je zelf logica maakt om een (nog niet goedgekeurde) html 5 'standaard' te vervangen door een datetime picker, zul je ook zelf logica moeten maken die afhankelijk van welke van deze twee je hebt, een waarde uit te lezen.

Een waarde van een datetimepicker (stukje JS, zou browser onafhankelijk moeten zijn) is gewoon anders dan die van html5 (is helaas browser afhankelijk).

[ Voor 12% gewijzigd door BasieP op 30-08-2013 11:45 ]