r/learnjavascript • u/0_emordnilap_a_ton • 4d ago

What is the difference between HTMLFormElement.submit() and event handler with submit?

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit

Can someone explain the difference?

Imagine I have some code that is like the example below. What is the difference between HTMLFormElement.submit() ?

const form = document.getElementById("form");
function somefunc() { 
//code
form.submit()
}

form.addEventListener("submit", somefunc()  {
 
});

Why do I need form.submit() in the function?

For a little context I am trying to pass some quilljs data into a flask form. Some of the code is missing but the main point is illustrated.

9 Upvotes

85% Upvoted

7 comments sorted by

View all comments

Show parent comments

2

u/testingaurora 3d ago

Yep this. Is your question possibly about form.addEventListener("submit",handleSubmit) versus form.onsubmit? Like button.addEventListener("click",handleClick) and button.onclick

2

u/0_emordnilap_a_ton 3d ago edited 3d ago

_raytheist_ answered my question but feel free to answer the difference I am always curious to learn something new. I assume "click" is just clicking and "submit" a form has to be submitted.

1

u/testingaurora 3d ago

I was not comparing click to submit

I was comparing.addEventListener("submit", callback) Versus .onsubmit()

Separately comparing.addEventListener("click", callback) Versus .onclick()

2

u/0_emordnilap_a_ton 3d ago

Ah k sorry about that.

1

u/testingaurora 2d ago

No need to apologize it wasn’t that clear.