Question

I want to submit a form using submit(), and indeed it works fine when I only use submit() without any anonymous function inside, the problem is when I use the anonymous function like this then it stops working

$('form').submit(function() {
    alert("alert never shows up :( ");
});

This is my code: (sorry for mixing jQuery and getElementsByTagName, old guy’s fault)

var uform = $('#createItem1');
if(uform[0]) {
    // UI's first validation image extension before server-side
    var _validFileExtensions = [".jpg", ".jpeg", ".gif", ".png"];
    var arrInputs = uform[0].getElementsByTagName("input");
    for (var i = 0; i < arrInputs.length; i++) {
        var oInput = arrInputs[i];
        //Checks if image is of valid extension
        if (oInput.type == "file"){
            var sFileName = oInput.value;
            if (sFileName.length > 0) {
                var blnValid = false;
                for (var j = 0; j < _validFileExtensions.length; j++) {
                    var sCurExtension = _validFileExtensions[j];
                    if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) {
                        blnValid = true;
                        // this works fine
                        $('#createItem1').submit();
                        break;
                    }
                }

                if (!blnValid) {
                    alert("Sorry, " + sFileName + " is invalid, allowed extensions are: " + _validFileExtensions.join(", "));
                    $('a#linkStep1').trigger('click');
                    return false;
                }
            }
        }
    }
}
return false;

Again, as soon as I try to replace current submit() for something like this, it stops working

$('#createItem1').submit(function() {
   alert("something");
});

Any idea why is not working?

Answer 1

If you pass a function (anonymous or otherwise) to the .submit() method that defines a handler that will be run when the form gets submitted, but it doesn’t actually cause the form to submit. If you pass no parameters to .submit() that makes it submit.

If you want to define a handler and submit at the same time you can do this:

$('#createItem1').submit(function() {
   alert("something");
}).submit();

.submit() with no parameters is a shortcut for .trigger("submit").