JQuery form submit doesn't work when callback function is used

Question

I seem to have hit a major anomaly that I have never before experienced.

I have this

<form id="form_exceller" enctype="multipart/file-data">

                <div class="input-control file">
                    <input id="filei" name="filei" type="file" />
                    <button class="btn-file"></button>
                </div>

            </form>

Now when I call this

$("#form_exceller").submit();

after a click event, it works perfectly, but once I introduce a callback

$("#form_exceller").submit(function(e){
  console.log("frustrating");
});

nothing happens afterwards. It just goes dead. Same click event that triggers it when it doesnt have the callback cannot trigger it when it has the callback.

Would really appreciate any help I can get.

Thanks

Answer 1

According to submit API

handler Type: Function( Event eventObject ) A function to execute each time the event is triggered.

so you need to bind handler and then call action

$("#form_exceller").submit(function(e){
  console.log("frustrating");
});
$("#form_exceller").submit();