Wikiki/bulma-calendar

Input field value is not read correctly upon attach

Niek opened this issue · 5 comments

Niek commented

This behaviour broke in one of the recent versions. Before, I could set a date value like this:

<input type="date" id="date" value="2021-07-05">

When attaching bulmaCalendar, the set date is no longer read in correctly (i.e. it shows no date in the calendar). To fix this, I have to manually run:

bulmaCalendar.startDate = '2021-07-05';
bulmaCalendar.save();

There is an additional small bug here, when manually setting the date like this it's not shown as selected when clicking the calendar. Only when navigating back&forth a month it shows correctly.

michael-hack commented

Oh, I think I knew what happend there. Meanwhile, the passed value must match the configured date format. However, I didn't keep in mind to adjust the default value ("MM/dd/yyyy") to the classic value for a date field.

Can you please test appending the parameter data-date-format="yyyy-MM-dd" and tell me if it works then?

I would then change the default value.

Niek commented

Unfortunately that doesn't fix it, my attach function already has dateFormat: "yyyy-MM-dd" as option listed but that does not make a different. Let me know if you need a test case.

michael-hack commented

Ok fixed, small issue, big effect.

I play with the idea to keep the input/output value of the input always in the ISO time format, independent of the set formatting. What do you think about this? Good or not?

Niek commented

I can confirm it's fixed in 6.1.9, thanks!

Somewhat related issue I found, it's not possible to pre-fill a range, I get an error like this:

The specified value "2021-06-08 - 2021-07-08" does not conform to the required format, "yyyy-MM-dd".

I play with the idea to keep the input/output value of the input always in the ISO time format, independent of the set formatting. What do you think about this? Good or not?

Do you mean to force users to use ISO format in the input field value? Because that's not preferably, in many cases that would require an extra format with a value coming from e.g. a DB.

michael-hack commented

Somewhat related issue I found, it's not possible to pre-fill a range, I get an error like this:
The specified value "2021-06-08 - 2021-07-08" does not conform to the required format, "yyyy-MM-dd".

That's an error message from chrome and the reason why I play with the idea to change the input value to ISO. If you create a date input in Chrome the value must be in ISO, otherwise the value is not loaded and this message appears.

Try it with a single date in "MM/dd/yyyy" and you will get the same message. In Firefox all works fine... To avoid this in Chrome, you'll have to set the input type to text and set the type later to date with js in the calendar initialization.

Do you mean to force users to use ISO format in the input field value? Because that's not preferably, in many cases that would require an extra format with a value coming from e.g. a DB.

Yes, but only for the input value because of the above mentioned problems with Chrome. Calling the value() function or setting the start/end date properties would be still possible in the configured format.

I personally, for example, save and process all date values as ISO and format them only for output accordingly.