Calender - Birthday Input

I am using latest version for Framewrok7. I have one field that is for date of birth.
What i want to change here is that let the user enter/select year, let’s say 1985.

Can we set the dropdown on Year Digits?
So user can directly jump to select 1985 instated of pressing left/right arrows several times.

Hi, i make a fiddle with a prototype of the solution, you will have to change the code to your needs:

Just click the current date ‘may, 2018’ and a smart select will open. select the year and the calendar will scroll to that year, month january. As i told you, its just an example code, its not perfect, but its a start so you can achive what you want.


Yes, it is probably better to use something like Smart Select or Picker for year-only select

1 Like

Hey @pvtallulah Thank you for the update.
What can i do if I want to open calender in Popup?

Just change the layout to your needs.


1 Like

I checked your updated code on jsfiddle. but still not working as I wants for my project.

Check this Fiddle
Check this video

When I try to click on Done button, Calender is not closing and stuck on the screen.

Please check this.
Thank you.

@nolimits4web Can you please look into my last comment?

Hi samir,
I see the error you are talking about. Didnt have the time to find a solution as you ask.
But you can use 3 smart selects, 1 for days one for month and 1 for years.
Since you dont want use a calendar native solution. Insted of redoing the calendar just change the method the user imputs the data.

1 Like

Hi @pvtallulah,
Thank you for words,
I needs the same designs with calender inputs.
I know the method you told me about using 3 Smart selects for all 3 fields but client wants the calender UI.

No Problem, But I wish in next update of Framework7 this issue must be noted for Date of Birth inputs.
Thank you for your support.