Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Datetime Selector with Flatpickr does not displays Time (Hours & Minutes) in Firefox #1460

Open
cygro opened this issue Jan 11, 2024 · 1 comment

Comments

@cygro
Copy link

cygro commented Jan 11, 2024

General information

  • json-editor version: current

Expected behavior

I'm using the Flatpickr to display a combined date and time selector. When I click on the calendar icon in the input field, the picker opens, showing date and time selection element where I can choose year, month, day, hour and minute.

Actual behavior

Chrome, Safari (WebKit), Edge, Opera: Expected behaviour.
Firefox: Picker opens, but only selection of the date (year, month, day) is possible. Selection of hour and minute is not displayed.

Steps to reproduce the behavior

Open the "Datetime (Flatpickr)" example in the JSON Editor Interactive Playground (direct link below) in the different browsers.
Click on one calendar icon in one of the "Datetime" fields (right column).

Direct link to example: https://pmk65.github.io/jedemov2/dist/demo.html?schema=EQbwOgdgBFbALgS3gGwKZwFy2AEwIbxpIC2aUauyA9gE4UAe%2BJADugM5wA0kMciuLDiLt43XsICeLDMGxxqAIwBWaAMZjgPaDgBmdEoSFwA5rQHidClkmoROcqOB188idvkXoA%2BpWTfldjshXXwUdjRtGFcqDy80bxZaahlaJDQHbFDwjB0AXyicJJS0NMQMoWdonHYCIkqJarh4aVl5YFFzCBNLatd9WkNNdrrZQqaEZHRjYAARQnIACgBleC6TAEpevrhcDLVzG0RgxzhV%2FAgCWlwoUahdcpRBLUbo61t7Bpcd4DMBbzU1BQAFcSJ9HAAWcY%2FRAQFjA%2BAAQXga0QigRFUcVT6EzY%2BDUaAAFkC9rQZgBRCBEeijOCvap5elQRnfAqvOCiRBkL445qtGadWE9F7ffoGIynSbckW8yaoNo4AAqXKWq3WWxlPz27AOiCOJ3a50u%2BGuUFI5AeaCe2wmKQ%2BmScTNcf1wAKBoPB2ChTpwsPhSJR5nRIh5OLewDxBOJT1KFKppTNKrpouiLJxadT0I5o3NoYmLRkAtR3Rt4YGQxmOZVAFoUNQ1GFS64kPKZvMiOaoCti5smzhtbr9RAZkarjcq2Ra%2FWwvdHs9oa47cdPY6U87zK7ASCwQ7vWvfXCEcjUcHMdhsWGiih8USSbHJQBNJ8P6sAWVf1dmsygAAkf5hlmWZNLwzBlXjZb44F0WoFjzcMCwVDkez7KDxWGftYM1fMpkQuYFi7NUhQ1Bd%2B32Q4PhHeALjHW58MtJ4oAAd2QQl7mveAWEQNQAGsySw8MlzsB0Lx%2BF03W3Fc90vfhDwDE8MWEn1XEjW8Yz49pKWpWj6mAH0IOk4BdHYziePU1dL1cWEUFhNAfwENAAElZKENZgUiJScEY2h8BYFzaDckiJjCOtGKc%2F0%2FLcvSmVA5ks0MzlpXPJk%2BULSVBRLfixUGCV2lzTLhBwmZlTIAie2I5K8DIvUKMlUcTRuTt6JuZj4FYozCBM3iUOAQSVxEiYxK3D1d0Cg9%2FWPIMFLg2UVOjUk4y0vK9NGqDjK4rqsQ8uAvJ8iL3P3Vx2GJRiAGF0BNAAhBF4ANe4wgiUbLIgayIFs%2BywoRPbHtI0JgRQeAf2oYEzIAdm%2B3Y0F%2B%2F7X1hDEhAARgATnB4A0AgTx0GWdQ7FwB1XP2iycGJYGnIONAyCpIQACYUZIWGiFJ2hybR9CAGYUfNbwqYhQkzPxlHguoULnMcfGopTGL9LLGCOyTTaUxS3D0uFEjUOy9DdgWc0pwbFBupbaZJXbYgVVK9VuoHcjl0o6j6u0k3JzrXXZytZqWLYjr1r41WeqHRT91MDdxOGoQpLDGTxsDNEpvlwm4Fmu8zLgTSEwnWRlp9VbPdM6afh23zRf8gmLOaFUuZ5vmi4FlAQo%2B9Cxf3GKYEluKBEwpKFYQflJVhIgTHvH3yxyjCdJ9g3cONrsnL70pys7y3qutyVp7QfuaToudut6%2F2DMG90d1DlbgD9I8o9PHeS4ja8o0ThbU8w8X03A1u8o72UEJmXvV4Hiqh41qUxgVXHkVU2iwV5rznrKBeQ4ZjgITI1Te%2BV3jLgvrKPeEkRqZ2PrJCa0cQyx0vgnNSd96BLUbtFZ%2B7Jj5p1zorT%2B8Y17dT%2FpWLWNYnaNiQXKQ27RjadjAQw2eFsqowOXgI9estHbThQC7a0nDt653XP8IaB9IRHxPnJSa%2BC36EOvqpeakoU7iIdunchEtKGQUMm3HS2j8zd3aF%2FRhnDmGSlpJw4BRt8L8JnrQSBWphE1XaHAoxMi3atQ9hxL2W8%2FYKJwOgkOqisHqNwefGJyldFzXvBpeMRjgJhilrKdqESc4EIMvnL6W0AHl15uUg6OBBbC3CoXSKpin6sjig8V%2B5kfgfx7mIphaEZh5THoVSUxUlhBN8RMaBAScBBMTCVJqTF3aFM6t7Cq8iSmiSDsoySaicFnxjjY8OV8bwZKTsAQx8yTEgSPisyJmzZRlKacXAynNubVOedXWuItsANxAhQtpVCHg0IeVIVK9i%2BlOIGS41hkjdb6xGTw2F4yxGTPDNMpegSxH221uw6RiyWptTWsUn2GyjkDW2fvXZiT9nyS0V0gyRD9FZK0iCjOAdDLEo2uSvO3kC6%2FKrhUt5Fcalx2APUuue1H59BbkC9wIKeV0LSshKF6sWESLQDrDhwzWweI1WbIiQidRW1umcKixpTRpy1fiucSywlWRsuE1ZUT7QxMDkoqlmCOVJIOfS%2FqPwmWZJwJctljdblcrMv6iYDrXqisvsKj5Armn%2FLMYCixDwZYKn9Uq9oyt%2BlqphaPIBiKcCT27ObThGLTXADqpajers7WsRjRaCNUBqJQEJAIPY0B1EupQW634lKMGHxpZHOlZ4GXHMDeckNyLcnpnDdnblk7ZTNrsnsSVnyKnNrja8su7zK7JryQCsC%2BRIB5GAEAA%3D%3D%3D&value=EQbwOgdgBFbAzgEwIYBcCmcBcthwDSQxzyoCWAtpsDnAUbkmuuVdrvdLgGZMbt1ghLnF6tqtPEIai%2BLShI7SRwbmTniBU4cVXqU%2FGkp24yBxQAYTcMpqNWZwM8zs4HKtefbvda11B8eZwx%2FC0gAX2AgA&code=EQehAIBUAsFNwGYHsA2KkHcCWA7A5uCrrAM7gCGATvALbk4Am5ALkpQJ4WPjXkNI4U7AHTgAmkgCu4AMb0KDBrMklWNWUgbxyAIyQA3bdx2x0GYQB0cWBOAAUAKxKwGWVpXC5V9GbCS3sRkxhACkAZQB5ADkAUVd3AEpwJxc3NmEtVUokdjsEgG4rFPi2cABecBxYDHBA%2FnNw6Li0yjt%2BGUkaWBxmYQBHSVgOMNNYGXc7C2AAYicBAFpU93nkShophIAaZJcWcgLgIA%3D&style=ETI%3D&theme=bootstrap3&iconlib=fontawesome3&object_layout=normal&template=default&show_errors=interaction&required_by_default=1&no_additional_properties=0&display_required_only=0&remove_empty_properties=0&keep_oneof_values=1&ajax=0&ajaxCredentials=0&show_opt_in=0&disable_edit_json=0&disable_collapse=0&disable_properties=0&disable_array_add=0&disable_array_reorder=0&disable_array_delete=0&enable_array_copy=0&array_controls_top=0&disable_array_delete_all_rows=0&disable_array_delete_last_row=0&prompt_before_delete=1&lib_aceeditor=0&lib_autocomplete=0&lib_sceditor=0&lib_simplemde=0&lib_select2=0&lib_selectize=0&lib_choices=0&lib_flatpickr=1&lib_signaturepad=0&lib_mathjs=0&lib_cleavejs=0&lib_jodit=0&lib_jquery=0&lib_dompurify=1

{
  "title": "json schema example",
  "type": "object",
  "properties": {
    "example": {
      "type": "string",
      "description": "This is an example schema.",
      "default": "Please edit me."
    }
  }
}
@schmunk42
Copy link
Collaborator

schmunk42 commented Jan 17, 2024

The right column also alternates between browser-default (1st and 3rd row) and flatpickr (2nd and 4th row), this looks good to me:
image

Firefox does not support native datetime or time picker AFAIK.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants