Met onderstaand script kan je een 'normaal' inputveld veranderen in een datumveld met datepicker.
Datepicker toevoegen aan formulierveld
Voorbeeld
Bij deze uitleg gaan we ervanuit dat je al in een eerder stadiums eerder een van de contactformulier-scripts uit de library in de html-hoofdtekst hebt geplaatst.
De contactformulier-scripts zorgen ervoor dat elk formulier-label en het bijbehorende inputveld in een <div> met class .formWrap worden geplaatst.
Als je al een van de twee contactformulier-scripts in je html-hoofdtekst hebt staan kan je meteen door naar stap 1.
Als je nog niet een van deze scripts in je html-hoofdtekst hebt geplaatst kan je er door middel van het script hiernaast voor zorgen dat alle formulier-label en het bijbehorende inputvelden alsnog in een <div> met class .formWrap worden geplaatst.
Stap 1: Plak onderstaand script in de html-hoofdtekst
- in het onderstaande script staat bovenaan de volgende regel:
$('.formWrap:nth-child() input').attr('id', 'datepicker01'); - Controleer via element inspector in de hoeveelste .formWrap de datepicker
- Vul dit nummer in tussen de haakjes() die staan achter .formWrap:nth-child, zoals hieronder:
$('.formWrap:nth-child([VUL HIER IN]) input').attr('id', 'datepicker01');
Gefeliciteerd, het meeste werk zit er nu op! Ga nu naar stap 2 om de datepicker werkend te krijgen. Daarna alleen nog door naar stap 3 voor de CSS styling.