jquery preventdefault on submit form will not be re submitted

Question

I got issue on my code. I Have a html form where the button submit when clicked but there will be some checking first, if all values are true the form will be submitted - but on my code, it didn't work. does anyone have an idea about this?

 $("#button").click(function(e) { e.preventDefault(); if ($(this).attr("at") == "1") { //some checking alert("Subsssmitted"); $("form").submit(function() { alert("Submitted"); // it didn't passed the form didn't submitted }); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form action=""> <!-- some code --> <button id="button" at="1">Submit</button> </form> 

Answer 1

Add

$('#form').submit() 

after

$("form").submit(function(){
   alert("Submitted"); // it didn't passed the form didn't submitted
});

Since you are just defining event handler but not triggering submit event.

If possible move

$("form").submit(function(){
   alert("Submitted"); // it didn't passed the form didn't submitted
});

Outside the click event handler

Answer 2

You should do this in that way:

$("#button").click(function(e){
    e.preventDefault();
    if($(this).attr("at") == "1"){ //some checking
        alert("Subsssmitted");
        // here you trigger event
        $("form").submit();
    }
});
// here you listen event
$("form").on("submit", function() {
    alert("submitted")
})

Just get it here https://jsfiddle.net/6hzt663q/

Answer 3

 $('#myForm').submit(function(event){ // do your validation success if(!success){ event.preventDefault(); } console.log('fsdfsdfds'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="myForm" action="/google"> <input type="text" id="name"> <button id="button" at="1" type="submit">Submit"></button> </form> 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 4

Your code is working for me, remove e.preventDefault() and try,

 $("#button").click(function(e){ if($(this).attr("at") == "1"){ $("form").submit(function(){ console.log('done'); }); } }); 

 <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <form action=""> <button id="button" at="1">Submit</button> </form> 

Answer 5

Just removed "e.preventDefault();" on button click event and it will work fine.