Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

iOS Safari Bug: Native Select Box Opens Unexpectedly After Modal Reset


Dear [Theme Developer / Support Team],

I’m experiencing a specific issue on iOS (Safari) devices when using the modal form provided in your theme. Here's a detailed description of the problem:

When the modal is open and contains at least one <select> input,

If I click the Cancel or Close button (which triggers a SweetAlert confirmation),

And then choose to confirm closing the modal (which resets the form using form.reset()),

The native iOS Safari browser unexpectedly automatically opens the <select> dropdown, even though the modal is being closed.

This only happens on iOS Safari, and it seems to be caused by form.reset() triggering a focus on the select element right before the modal is removed from view. The issue does not occur on Android or desktop browsers.

What I’ve Tried:

Manually blurring all <select> elements before resetting the form

Adding a short setTimeout delay before form.reset() and modal.hide()

Disabling pointer events for select during SweetAlert (via body.swal2-shown select)

Replacing the reset with a custom function that manually clears all inputs

None of these fully resolved the issue.

Please let me know if you can provide a fix or consider including a patch in future updates.

Thank you for your support!

Best regards,


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


Hi,

Could you please provide us more details ? Which Metronic version are you using ? Metronic v8 or Metronic v9 ?

Regards,
Sean



Hi,

Metronic Product Version: 8.2.9
Demo 60: https://preview.keenthemes.com/metronic8/demo60/index.html

Best Regards.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(