Form submitting

How to succesfully preventdefault ? I've tried a variety of things but it keeps refreshing the page afterwards
No description
No description
21 Replies
Jochem
Jochem14mo ago
You have to put event as a parameter in the function definition. And defaultPrevented is readonly, you have to call event.preventDefault() instead https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault
Event: preventDefault() method - Web APIs | MDN
The preventDefault() method of the Event interface tells the user agent that if the event does not get explicitly handled, its default action should not be taken as it normally would be.
Jochem
Jochem14mo ago
so function checkCredentials(event) {
Brightie
BrightieOP14mo ago
well, that is one of the things I tried but it didn't do as I had hoped :(( I will try it again Originally I had it in a different function first, being form.addEventListener("submit"), function(event){event.preventDefault; checkCredentials()} but that didnt work
b1mind
b1mind14mo ago
Sidenote I'd submit the form event not the button. Then you can use the form API?
Jochem
Jochem14mo ago
you have to call preventDefault, gotta have the () in there
Brightie
BrightieOP14mo ago
so like this? <form onsubmit="function()" . Well, when I added the () it gave an error claiming it aint nof unction
b1mind
b1mind14mo ago
I like this better yea
Brightie
BrightieOP14mo ago
giveme a sec
Jochem
Jochem14mo ago
no, event.preventDefault();
Brightie
BrightieOP14mo ago
Well I'll be damned, this time it did the trick I hate it here, i could swear I tried this once before yet it didnt work lmao Oh by the way I've always wondered right, it says "event." is deblabla but if you do it without, it fails what should event. actually be replaced with? deprectaed* aa deprecated*
Jochem
Jochem14mo ago
not sure what you mean, event.preventDefault() is the intended vanilla way of cancelling an ongoing event
Brightie
BrightieOP14mo ago
see the small event ? If you hover over it it says its deprecated
No description
Jochem
Jochem14mo ago
I think that might be because you're not passing event in. It should be (event) => {event.preventDefault();
Brightie
BrightieOP14mo ago
oh I see, well it works either way tho is it adviced to still put event in as parameter or does it not really matter ? Because if it doesn't really matter I don't see the point of adding it in as paramter, but if it matters for for example errors or safety, then ill put it in
b1mind
b1mind14mo ago
it does matter
Brightie
BrightieOP14mo ago
It does? in what way
b1mind
b1mind14mo ago
because you should write clear code the only reason I can think of it working is more of a side effect of arrow functions and this I'd never write it that way
Jochem
Jochem14mo ago
reading code is 10x harder than writing it, and being explicit is worth the extra 5 keystrokes
Brightie
BrightieOP14mo ago
Alright Alright, you win, I'll put it in I can't argue with those solid arguments
b1mind
b1mind14mo ago
event is one the few times I'll just use a letter e too >.>;; just cause its so common but its better to write it out
Jochem
Jochem14mo ago
same I finally managed to break the terrible habit of using e for element as well >_>
Want results from more Discord servers?
Add your server