Liveview 0.17 and the Modal component

Hi All

I’m currently converting an application from LiveView 0.15 to 0.17 and I’ve come across an issue with the new Modal component.

I have a fairly standard form that has a date field. I’m using flatpickr to display a nice calendar when the user needs to enter a date. All of this worked fine with 0.15.

Moving to 0.17 I find I’m no longer able to interact with the calendar. For example with the calendar displayed I used to be able to select the month. With 0.17 selecting the month now makes the Modal component disappear. I believe this is to do with the new “phx-click-away” binding.

It appears that the click-away is too aggresive.

Has anyone else come across this problem and if so how have you solved it?

cheers

Dave

1 Like

Hi All

I’d like to ask a different question to my original one above.

Does anyone having a working date picker as part of a form using Phoenix Liveview version 0.17? Would you mine sharing the code with me?

cheers

Dave

I struggled with this recently. Here is a working example of how I managed flatpickr with an alt format also

See the app.js

And the Heex file

3 Likes