8 ms·
Tip: if you input something and press "enter", it will reset the form. You should attach the event listener to the form's onSubmit, and not to the button's onCl
by franciscop 7y ago
Tip: if you input something and press "enter", it will reset the form. You should attach the event listener to the form's onSubmit, and not to the button's onClick.
- stanski 7y agoAh, I thought it was broken.
- tannerljohnson 7y agofixed :) thanks for the feedback!
- hanniabu 7y agoIt'd also be nice if after submitting for one and selecting enter that it autofocuses on the input for the next question so you can start typing without clicking on it.
- tannerljohnson 7y agothis has been fixed :D thanks!
- franciscop 7y agoNo problem! You also have a label repeated, which makes the first item to select the second radio-button: <input type="radio" id="factor-weight-4" name="score" value="4"> <label for="factor-weight-3">super important</label> <br> <input type="radio" id="factor-weight-3" name="score" value="3"> <label for="factor-weight-3">pretty important</label>
- tannerljohnson 7y agogreat catch -- fixed now, thank you!
- joppy 7y agoIs there some book of best web dev practices where stuff like this is written down?
- austincheney 7y agoNo because the default behaviors not defined by a standard. Example: https://forum.vivaldi.net/topic/43170/backspace-shortcut-should-be-disabled-by-default/14 https://forum.vivaldi.net/topic/43170/backspace-shortcut-sho...
- masonhensley 7y agoNot that granular yet, but I’ve been capturing user story/ acceptance criteria level best practices. Currently at ~800 B2B focused modular “specs” that find the middle ground between devs and non technical team members. My email in profile if you’d like to check it out.
- franciscop 7y agoNot that I know of. I learned through years of practice and reading hundreds of varied blog posts. If you find a book or resource like that please ping me.
- jmchuster 7y agoYou might notice by just using the web, or you might notice it when testing the form on one of your first assignments, that you can submit a form by pressing enter in an input box. So then you might look up the documentation for the submit event on forms: https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#implicit-submission https://html.spec.whatwg.org/multipage/form-control-infrastr... And then realize that adding the onclick handler on the submit button handles one use case (clicking the button), but a more general solution would be to add the onclick handlers on the form itself. Then maybe you start thinking, huh, what happens when someone tabs to a button and presses enter, does the onclick handler work there? And so on and so on... So the answer for where it's written down, it's in the documentation. But most people these days can't be bothered with things like reading documentation and textbooks and reference manuals, so, uh, I guess you just need to have a little bit of experience combined with an attention to detail?
- dheera 7y agoor better yet, don't even use <form> for things that don't submit a traditional old-style POST/GET to a server. if you're handling all your logic in javascript on the client side, OR doing everything with AJAJ [0], <form> is unnecessary and you can handle things with button.onClick -- you get to program it just like any other GUI. [0] most people use JSON not XML so i prefer to call it AJAJ not AJAX
- Chickenosaurus 7y agoThere are some downsides to that approach. The <form> element has semantic meaning which is lost if it's missing. Screen readers for blind people, browser features such as form auto-fill etc. might not work as expected without this semantic information. Most web applications I have seen opt to use the form element. The default form browser behaviour can be suppressed easily.