Issues with Mac / Safari date display

Wappler General Need Help
1

Hello, i have a page that displays a date of birth from a record.

The issue that i have is that while it shows fine for me (Windows / Google Chrome), i have a client that is working on a mac with safari and it doesn't display the default date.

Here is what it should look like

image

But on the mac, its a blank text field

here is the code i use for the input value
<input id="dob" name="dob" type="text" class="form-control" is="dmx-date-picker" showdropdowns="true" minyear="1920" required="" dmx-on:changed="var_age.setValue(value.yearsUntil(var1.datetime))" format="MM/DD/YYYY" dmx-bind:value="sc_patient_info.data.query[0].dob.formatDate('MM/dd/yyyy')">

can you see any reason why it wouldn't show for them?

2

Hi Brandon,

If the website is accessible to test, then I can run it on safari and check for any errors.

3

unforunately is not, but i created a test page for you to review it.
https://atgenius.com/test.asp

you can see that on Google Chrome it will display the DOB, but on an Ipad or any mac device, its blank.

4

If you open your browser console, you will see this message:

Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non RFC2822/ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to Moment.js | Guides for more info.

Not sure if that's the cause of the problem on Safari, but regardless it's something you must also fix. I'm not familiar with the problem or the date form field web component so I can't provide further advice. Check if you're doing things the right way (according to the documentation), and if yes, consider opening a bug report.

5

I don't know if this has anything to do with it but curious as to your intent. You have two values assigned to the input. One dynamic and one static?

Also, how is the date stored in your database? Is it mm/dd/yyyy?

But I think Apple has probably hit on something.

6

I am also getting the same message as Apple has posted.

I can also see a hidden input as Brad has posted, which is showing the DOB correctly, but the returned date value is in different format to the visible input field.

<input type="hidden" name="dob" value="02-10-1995">

You can try changing the formatting to Localised L instead of MM/DD/YYYY to see if it resolves the issue.

I will suggest adding 2 or 3 input fields on the test page with localised formatters and corresponding formatters of the dynamic value to check the most appropriate format for your app. We can test these and let you know if there are any errors.

dob.formatDate('MM/dd/yyyy') format="L"
7

Using standard format of yyyy-mm-dd should work for all locales/os/browsers.

8

hi Brad,

i only show a dynamic value for the input pulling the DOB from the database
dmx-bind:value="sc_patient_info.data.query[0].dob"

also, the dob in the database is stored as mm-dd-yyyy format

9

even if i remove the Format altogether, it still does not display the date on the safari browser.

10

are you only seeing that hidden field on the safari browser? Because i have checked the code and i do not see where you are seeing a hidden field for the DOB in the page.

11

The hidden input field is visible in safari and edge browsers, the two browsers I have checked.

Screenshot 2024-10-02 at 9.48.02 pm
Screenshot 2024-10-02 at 9.48.02 pm742×344 54.1 KB

12

that is the strangest thing. Any idea why that code would be automatically entered? Its not in my coding on the site

Screenshot 2024-10-02 080118

13

Never noticed this before. I checked the dmx-date-picker input field in another project and I can see that a hidden input field has been automatically created with name and value, if available.

14

i also created a 2nd input value for the DOB and removed the dmx-date-picker from the formatting and it shows the DOB date fine on safari - take a look
https://atgenius.com/test.asp

so is this a date picker issue?

15

Have you tested what's described in this reply?

.formatDate('yyyy-MM-dd')

And when you test, open your browser console to see if the deprecation warning still persists

16

i did test the format and it didn't change the outcome.
Unfortunately i can't open a console as i am working soley on an Ipad to test the page. I am not a Mac user, so i only have limited equipment.

17

The deprecation warning happens on a non-Safari browser, you can see it in your usual computer

I don't know how to solve the problem :frowning: Good luck