Dependent fields for multi-select options and dropdown fields are not displaying in Safari, although they work correctly in Chrome and Firefox.
Scenario You have a form built with ASP.NET and Razor, where users need to select multiple options from a dropdown list to trigger the display of dependent fields.
Multi-Select Dropdown: The form has a multi-select dropdown for choosing different categories (Category A, Category B, etc.). Dependent Fields: Based on the user's selection, certain dependent fields should become visible. For example, if the user selects Category A, an additional input field titled "Details for Category A" should be shown.
Expected Behavior (Chrome & Firefox) When the user selects Category A or Category B, the corresponding input fields are displayed dynamically, functioning as expected.
Issue in Safari :
In Safari, the dependent fields do not show up when a user selects any category. It's as if the JavaScript or the CSS responsible for displaying these fields is not executing correctly.
CHROME
SAFARI
Browser: Safari (Version 18.0 (20619.1.26.31.6)) Operating System: MacOS (sequoia 15.0) Device: MacBook Pro 14 Inch Apple M3 Pro , iPhone 14 iOS 18.0