Reset form invalid values |
Reset form invalid values |
RainLover |
Apr 10 2019, 02:57 AM
Post
#1
|
Advanced Member Group: Members Posts: 216 Joined: 16-November 09 Member No.: 10,346 |
Here’s a sample form:
CODE <form> <input type="number"> <input type="number"> <button type="button">Reset</button> </form> var form = document.querySelector('form'); function detectChange() { var inputs = form.querySelectorAll('input'); for (var input of inputs) { if (input.value) { return true; } } } form.querySelector('button').addEventListener('click', function() { if (detectChange() && confirm('Are you sure you want to reset?')) { form.reset(); } }); DEMO I’d like the reset button to work even if the user enters non-numeric values. |
Christian J |
Apr 10 2019, 05:37 AM
Post
#2
|
. Group: WDG Moderators Posts: 9,665 Joined: 10-August 06 Member No.: 7 |
I’d like the reset button to work even if the user enters non-numeric values. I recall form fields with invalid values are not passed on to javascript (or submitted). So my guess is that if a user enters a non-numeric value in a "type=number" form field, the field will appear to have no value and "if(input.value)" will not return true. |
pandy |
Apr 10 2019, 05:58 AM
Post
#3
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,734 Joined: 9-August 06 Member No.: 6 |
I guess a normal reset button is out of the question?
|
RainLover |
Apr 10 2019, 12:15 PM
Post
#4
|
Advanced Member Group: Members Posts: 216 Joined: 16-November 09 Member No.: 10,346 |
I guess a normal reset button is out of the question? QUOTE You should usually avoid including reset buttons in your forms. They're rarely useful, and are instead more likely to frustrate users who click them by mistake (often while trying to click the submit button). Source: MDN |
Lo-Fi Version | Time is now: 13th May 2024 - 07:02 AM |