Form doesn’t submit

Question

I've a form like this with my Javascript code:

 var btnSubmit = document.getElementById("submit"); btnSubmit.addEventListener("click", sending); function sending() { btnSubmit.disabled = true; btnSubmit.value = "Sending..."; btnSubmit.form.submit(); //<----- this doesn't do anything!!! } 

 <form id="form_save" action="/ValidatePicsServlet" method="post"> <!-- more inputs --> <button id="submit" type="button">Save changes</button> </form> 

As you can see, the last line doesn't do anything, and the data is not submitted.

Where am I wrong?

EDIT: I'm so so sorry! I had a mistake copying the code. The eventListener actually called sending function, that was right. I'm embarrased...

Answer 1

This is because form.submit is override by the submit element you've created inside the form. Just change the id of your button and it's work like a charm.

 var btnSubmit = document.getElementById("submit-button"); btnSubmit.addEventListener("click", sending); function sending() { btnSubmit.disabled = true; btnSubmit.value = "Sending..."; btnSubmit.form.submit(); } 

 <form id="form_save" action="/ValidatePicsServlet" method="post"> <!-- more inputs --> <button id="submit-button" type="button">Save changes</button> </form> 

Answer 2

尝试将“提交”类型添加到表单按钮。

<input type="submit" id="submit" value="Submit">