How to use the Ionic 6 Datetime component

[@Mars-5S]

Even 2 years still usefulllll!! Thank you Simon, wish you only the best

[@FrancescoDeGiorgio]

there is a way for selecting a range of dates? like starting / ending date?

[@danielalmeida8783]

It would be great if Simon could post a reply for this matter, or even a video! thanks 😊

[@taheralisonkachwala2955]

Yes I am also looking for the similar things for fromDate-toDate selection

[@malarkodi4119]

Yes I am also looking for the similar things. Any possible is there to getting starting/ending date in ion-date using date range

[@artyomzayarny3774]

Thank a lot. It's takes 15min to create a cool modal datePicker. I'am writing on Angular at first time.

[@pdssandeep2379]

@Simon is there any option to hide the mobile keypad while opening the ion-datetime in the mobile. I want to block users to enter time manually in my application

[@Ali-ys7ej]

was waitin' for this !!

[@dominiclee3809]

Hi Simon, do u know how we can set default time with Ionic date time?

[@andersonbdm_]

Hi, how are you? How can I get the current month using the arrows?

[@younesaberkane6721]

Ionic 6 datetime component is a nightmare to use and feels like still in beta.

[@charbelchaer1052]

is it possible to place the cancel and done buttons on top instead of bottom ?

[@digital-artefakt]

Ionic is great tool! Thank you for your work, man, really appriciate it.

[@galaxies_dev]

Glad you enjoy it!

[@keerthanreddy6859]

i am having one modal popup in that i am using my iondateTime , after opening datepicker when i am clicking on select button it is closing first modal, how can i stop closing modal on enter select button, please help .

[@therandompeeters7485]

Could you upload the final project?

[@julianschafferhans1034]

Is there a way to change the font-size of the ?

[@Eyezbergslim]

Simon, great tutorial. How do you style the calendar pop up? Mine keeps appearing Black on screen.

[@galaxies_dev]

You can use the CSS variables for the calendar from the documentation!

[@arj1411]

Swipe seems to have some issues. It's not completely change to next or previous month on swiping left or right.

[@S7Ojea]

Great video, just what I needed! Thank you!

[@galaxies_dev]

Glad it helped!

[@haniqudsi]

Thank you soooo much,,,, I've been waiting for that. As always, you are awesome Simon.

[@galaxies_dev]

My pleasure!

[@JeetuChoudhary001]

In the app I am working on, I need to set a default time value and then update it dynamically if there is value stored in local storage from previously. For date i am passing a string value of date and it is working. But for time when i pass "HH: mm" format then it says invalid time value. What i can do about it? any suggestions will be appreciated. Thanks

[@25kyro]

I want to be able to set Minute and hour values depending on the day selected , so if its a saturday maybe 10-12 if its a sunday 5pm to 7 pm and so on. How can I accomplish this?

[@PanamaRobinZ]

Hi Simon great video. I can't seem to get placeholders working for the date inputs, have you seen any workarounds on this issue?

[@MarijkeMeersman-pi2rm]

I have exactly the same problem

[@mukeshm280]

I’m looking for date-time range selection, any leads would be appreciated

[@nayankhokhar1353]

Is there any way to highlight some specific dates in ion-datetime using ionic 6.

[@galaxies_dev]

Haven't tried that but I don't think it's meant to be be used as sort of a calendar.. but perhaps it's possible with CSS!

[@sebastiancerutti3944]

ionic 6 show-default-buttons --- How can i change the name of the buttons? tks!!

[@Sh1n1x]

Thanks Simon you saved my life! :)

[@galaxies_dev]

Great to hear!

[@jordanmiquel4886]

Thanks Simon you are the best

[@galaxies_dev]

Thank you Jordan

[@jagrutipatil809]

Hello sir i want presentation="time" with HH:mm:ss but problem in ionic 6 ss not display only getting HH:mm. Please reply if possible.

[@younesaberkane6721]

Nice vidéo thought, thanks :)

[@yagnakarthikvaka1461]

Hii can we show only sundays in every week ? Is it possible in ionic v6 ?

[@ivonikolov835]

Simon quick question: how can I remove the arrows of the calendar in the top right corner. They do not work properly and I want to remove them. However the shadow dom does not let me, any suggestions?

[@galaxies_dev]

Good question Ivo, I actually can't see a way right now.. Maybe open an issue on Github so that in the next release this would be accessible inside a part!

[@SamiullahKhan]

I am using ion-popover instead of ion-modal, than @ViewChild is always empty, even in the afterViewInit, what could be the reason?

[@paoloperana]

Thanks a lot, Simon! Exactly what I was looking for! Great!

[@galaxies_dev]

Great to hear!

[@hungoduy3522]

thanks very much for your video. I have a problem that when i pick the time, the time value displayed on the datatime is utc while the memory still get the true time selected from the time wheel. to be more specific, at 13:14 in the video if i select 9 o'clock just like you, the value in the memory is 9 o'clock, but the value displayed on the datatime is 2 o'clock because i'm in GMT +7. please help me fix it. I even try locale

[@rn.s9]

Great video! Simon is it possible for you to explore how this file url system works to access files in sdcard, internal storage and through pendrive via OTG

[@rmadimed7257]

i really appreciate your work simon realy good job you the best and can you check please in capacitor camera toturial why it s not working on android and in your vedio you didnt show as how it s work on android you just post the image

[@RajeevKumar-st5hr]

How to show datetime in device datetime format?

[@younesaberkane6721]

Why remove the datepicker ? People really used it, team should’ve added it in the presentation modes

[@RodrigoMuVa]

Yes !

[@prasadnarayana7257]

Your awesome as always Big fan as you know 😉

[@galaxies_dev]

Thanks Prasad 🙏

[@toxaq]

It's frightening that the brand new datetime component does not seem to have a reliable and canonical way of getting the date value or having a single change event... Surely priority number one?

[@mikewajda9912]

Great video as always!! Random question, do you think the same ionic app can be used for native mobile as well as the web? To clarify my main issue is around desktop users. With the split view, css tweaks you can make it look pretty good but sometimes I feel it’s not enough. So do you think that is a good approach or is it better to just create a separate app for the web and reuse code between the 2? Thanks

[@galaxies_dev]

Usually your goal should be to have only one codebase. If certain component don't work for you on the webm maybe only create those components (e.g. with Stencil) or as a library and use them for desktop. But with 2 projects for web / mobile you really lose a lot of what makes Ionic so appealing!

[@denisgandzii1551]

I think new date-time component can be better, at least it should work with iso string date and better with javascript Date object. It is getting lost in time zone, work buggy with form control and is completely lost in desktop version. Is just easier to create another one for desktop. But video is cool and really like what you do. Thanks for it an lot others.

[@galaxies_dev]

Good points, and glad you enjoyed the video!

[@66marten]

Phew, what have they done. It's so much more complicated to implement this than in ionic 5.

[@muhammadsufian4611]

There is one weird issue that i have seen. If you have default buttons added in ion-datetime modal then if you select a different time then the time value is not update. It is really weird

[@garyrylander9376]

This needs to be corrected soon. I get the same issues.

[@VlogdoBrasil]

nice!

[@galaxies_dev]

Thanks!

[@arman2r]

the experience del datetime is dire, regressed regarding user experience and ease of integration

[@arman2r]

so, how can get event of calendar-month-year for changed month and year, but with another button more saying

[@sharutzagmail]

This is a nightmare! How to bind a ion-datetime to FormControls(it worked like a charm in ionic 4)? Why do I need 3 variables to collect and process a datetime value (one to display it, one to bind it to a formControl, and one to pass as default value to ion-datetime)? They just ruined it!

[@argelpamintuango1956]

there is bug on this where it doesnt hide the past time even you already set this on min property. it only hides past time when moving the minute of it. its 10months existing and you dont care

[@manishmunjal6339]

your videos are very good, but please attach the code also

[@ricko13]

Loveeeee it♥

[@dharmendravyas4408]

Git hub repo is available for this code

[@galaxies_dev]

Link in the description to the written version!

[@tarassvidnytskyy3298]

Does calendar swipe work properly for everyone? I have it working like on 4:16 of this video (kzbin.info/www/bejne/n6LCiXyGotFsla8). It sticks on swiping when there is about 25% way left. I've tested on the web and on Android. Also, when I use showClearButton="true", it disables from switching between months on Android.

[@FrancescoDeGiorgio]

I have the issue on Android but it works fine on iOS

[@hankicarl]

same issue with Android. when swiping or clicking next on the arrows it doesn't change the Month string (changes the date section) and generally seems buggy. In iOS that works but when selecting a date it doesn't highlight the chosen date. Date picker still seems quite buggy

[@ylast3756]

where is the code????????

[@galaxies_dev]

Linked below the video :)

[@taheralisonkachwala2955]

Capacitor Date picker is better than this 😓....it feels very native

[@SpaceyCadet]

Do you recover hacked instagram accounts

[@keno4you]

So many lines of code to display a simple input that on click use the native datepicker selection. Horrible this ion-datetime !!!

[@saviocamacam1974]

This datetime picker sucks! It's horrible!

[@galaxies_dev]

It has some strength, and it got some improvements lately!

[@saviocamacam1974]

@@galaxies_dev I just can't get it to work practically (as it was in version 5) using ReactiveForms! Did they simply destroy the component's functionality? Simon, please try to make a material with ReactiveForms.

[@monkemads]

@@saviocamacam1974 Yup, my experience has also been horrible trying to integrate this v6 datetime with Angular ReactiveForms

[@carolruo]

is there a fix yet? because it´s really annoying to select the date in wheel mode with touch, it´s unusable