Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rendering on input element v5 #1230

Open
Shaker96 opened this issue Apr 20, 2021 · 0 comments
Open

Rendering on input element v5 #1230

Shaker96 opened this issue Apr 20, 2021 · 0 comments

Comments

@Shaker96
Copy link

Shaker96 commented Apr 20, 2021

Hi! very interested in using a vanilla version of this plugin... I am trying to render on an input element like shown below but when I select a date on the calendar, the input's value is not updated automatically and when I tried to access it with the pickadate:change the event fires but I don't have access to the formatted value as it says in the docs. Thanks in advance for the help

html

<div class="wrapper">
   <input type="date" id="element">
</div>

JS

const initialState = {
    selected: new Date(Date.now()), // this value is shown in the input on first load
    template: 'MM/DD/YYYY'
}
const picker = pickadate.create(initialState)
const inputEl = document.getElementById('element')
pickadate.render(inputEl, picker)

inputEl.addEventListener('pickadate:change', (customEvent) => {
    console.log('New value:', customEvent) // => this custom event doesn't have the formatted value
})

and the result in devtools is

<div class="wrapper">
    <input type="date" id="element" readonly="">
    <div class="pickadate--input-root">...</div>
</div>
@Shaker96 Shaker96 changed the title Rendering on input element Rendering on input element v5 Apr 20, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant