👀 Views: 78 💬 Answers: 1 📅 Created: 2025-06-28

html form-validation microsoft-edge HTML

I'm sure I'm missing something obvious here, but Can someone help me understand This might be a silly question, but I'm sure I'm missing something obvious here, but I am working with an scenario with custom validation messages for an HTML form in Microsoft Edge. Despite implementing the `setCustomValidity` method to provide user-friendly messages, the custom messages are not displaying as expected. Instead, the default validation messages are shown when I attempt to submit the form. I have tested the same code in Chrome and Firefox, where it works perfectly, but Edge consistently reverts to the default validation messages. Here is the relevant code snippet that I am using: ```html <form id="myForm"> <input type="email" id="email" required> <input type="submit" value="Submit"> </form> <script> const form = document.getElementById('myForm'); const emailInput = document.getElementById('email'); emailInput.addEventListener('input', function() { if (emailInput.validity.typeMismatch) { emailInput.setCustomValidity('Please enter a valid email address.'); } else { emailInput.setCustomValidity(''); // Reset custom message } }); form.addEventListener('submit', function(event) { if (!emailInput.checkValidity()) { event.preventDefault(); emailInput.reportValidity(); } }); </script> ``` Upon submitting the form with an invalid email, I see the default Edge message stating "Please include an '@' in the email address. 'test.com' is missing an '@'." I’ve checked that Edge is updated to the latest version (version 117.0.2045.43). I also ensured that no other JavaScript errors are present in the console that might be affecting the behavior. Is there something specific to Edge that I am missing or any workaround to ensure that my custom validation messages display correctly? Any insights would be greatly appreciated! For context: I'm using Html on Linux. Is there a better approach? Has anyone else encountered this? I'm using Html latest in this project. Any help would be greatly appreciated! My team is using Html for this microservice.