Is there a way to open the popup from an <input type="date" /> on the year select once you click on the calendar logo?
Normally you go to the day sect first and then have to click the year select in the popup manually, but for selecting your date of birth it would be nicer to start with selecting the year first.
Any suggestions are welcome!
I think there is no way for it Since it has been created by chrome. Instead, you can search for a library or a plugin for a better way. You can use certain libraries like https://flatlogic.com/blog/best-javascript-datepicker-libraries/ or specifically https://www.daterangepicker.com/
Related
I need to use a calendar for my React app where user can choose multiple days.
So far I only found the react-date-picker module but I don't really like its CSS customisation.
I thought it would be better to use HTML tag input type="date" if there is such an opportunity as it looks nice on all mobile devices(my app is for mobile devices only).
On desktop the behaviour of this element is different from the smartphone, it closes each time the user chooses the date but I don't need desktop and on smartphones the calendar is not closing after the click which is great, however, I want to style selected days somehow with the background so the user would see what he chose.
I figured out how to add all those dates to an array and it basically works OK on smartphones but the problem is I can not style the calendar the opens up.
Can anybody suggest how do I go about styling the days user clicked on? Because by default it shows background for the last date you chose and that's it.
This is my codesandbox link
HTML does not provide such kind of <input>.
You can use daterangepicker for ranges.
Or, MultiDatesPicker to be able to select specific days.
Is it possible to convert html tag/format <input type="date"> to html tag/format <select><option></option></select> ?
I just wanted to make an input type date to a select drop down format.
For example:
From
Date of Birth - input type date
To
Date of Birth - select drop down option
Actually, I don't want to separate the date of birth values into three. But instead, make a better solution wherein I can transform the input date into a select drop down one.
Anyone who can help me with this one? Thank you.
You may use jQuery plugin to showcase a datepicker like the one below:
https://plugins.jquery.com/datetimepicker/
You can easily find many other jQuery plugins for the same.
If you wish to play around with its UI, you may use jQuery UI built-in themes or write some CSS on your own.
Depending on the browser to open dialog. and also input type=date not support in every browser.
I would like to able to select all Wednesdays in a given month by clicking on the day in the calendar UI. For example to schedule a meeting that occurs on every Wednesday. I would like the user to be able to just click on a day name rather than clicking every specific date.
I was wondering if anyone is aware of a Javascript date picker library that already has this feature or is this something I will have to write myself?
I've looked at a few multidate pickers available out there (http://multidatespickr.sourceforge.net/ for example) and they all have a feature to select a RANGE or the entire week however it seems that none of them support selection based on a specific week day.
I'm using this date picker:
http://www.eyecon.ro/bootstrap-datepicker/
2 questions:
Anyone know how to make it work in Internet Explorer? It just
doesn't, try it.
How can I configure it such that it selects entire
weeks? (if a person selects a specific day in the week, the value
passed is the start of the week, it would also be good if it
highlights the entire week on hover)
You can try https://github.com/eternicode/bootstrap-datepicker which is an improved version of datepicker by eyecon.
You might also consider using HTML5's builtin datepicker by simply using
<input type="date">
I need such a form element: 3 separate drop-downs of Day, Month and Year, plus "calendar" button that shows calendar picker. Dropdowns should behave cleverly and know each other's state (e.g., no 31 February should be possible and leap years should be handled correctly). Calendar picker should show a little calendar, where user would pick a date and the pick would be passed to drop-downs.
I appreciate if you point me to an existing solution.
I intent NOT to use ExtJS or similar high-end framework, more on JQuery level.
Search for jquery demos on datepicker.
You will find a lot of datepickers along with the source code. You can select among them.
I use the jquery UI datepicker mostly.