Catch too long form submission

It depends on what type of UI you want to present to the user. You can simply lower the timeout at the server level and if it can't finish the response in time, it will abort. However, the user experience is pretty harsh, as they'll just get a generic timeout error that likely won't even be from your site. (They'll have to click back or something to get back to your site.)

If you just want to display a message after a certain amount of time has passed, you can attach to the form's submit event and use setTimeout to display an alert or something:

$('#MyForm').on('submit', function () {    setTimeout(30000, function () { // number is milliseconds        alert('Sorry this is taking so long.');    });});

Finally, if there's some method of tracking the progress of the action that's being completed server-side, you could use something like web sockets or long-polling via AJAX to provide a progress bar or status update of some sort. That's a bit more complex, though, and will require some research on your part.

There are two approaches, I will write two separate answers.

XMLHttpRequest progress approach (for modern browsers)

Just send data and read uploading progress from XMLHttpRequest:

//-------------upload ------------------var lastProgressIndex = -1;//is the file api available in this browser//only override *if* available.if (new XMLHttpRequest().upload) {    $("#upload-files").click(function () {               upload_files($("#files-to-upload")[0].files, lastProgressIndex++);        return false;    });    $("#files-to-upload").change(function () {        upload_files($("#files-to-upload")[0].files, lastProgressIndex++);        return false;    });    $("#upload-files").hide();}function resetFormElement(elem) {    elem.wrap('<form>').closest('form').get(0).reset();    elem.unwrap();}function clear_upload() {    //https://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery    var upload = $("#files-to-upload");    //upload.replaceWith(upload = upload.clone(true));    resetFormElement(upload);}//accepts the input.files parameterfunction upload_files(filelist) {    if (typeof filelist !== "undefined") {        for (var i = 0, l = filelist.length; i < l; i++) {            upload_file(filelist[i], lastProgressIndex++);        }    }    clear_upload();}//each file upload produces a unique POSTfunction upload_file(file, index) {    //TODO - vytvor progress bar podle indexu    $("#progresscontainer").append('<div id="progressbar' + index + '" class="progressbar"><div id="progresslabel' + index + '" class="progressbarlabel"></div></div>')    var progressBarSelector = "#progressbar" + index;    var progressLabelSelector = "#progresslabel" + index;    var fileName = file.name;    var xhr = new XMLHttpRequest();    xhr.upload.addEventListener("progress", function (evt) {        if (evt.lengthComputable) {            //update the progress bar            var percent = Math.floor((evt.loaded / evt.total) * 100) + "%";            //TODO http://www.binaryintellect.net/articles/859d32c8-945d-4e5d-8c89-775388598f62.aspx                              $(progressBarSelector).css({                width: percent            });            $(progressLabelSelector).html(fileName + ' ' + percent);        }    }, false);    // File uploaded    xhr.addEventListener("load", function () {        $(progressLabelSelector).html(fileName + " uploaded");        AddImageToGallery(GetFilenameWithoutExt(fileName));        $(progressBarSelector).fadeOut(500, function () {            $(progressBarSelector).remove();        });    }, false);    var guid = $("#Identification").val();    xhr.open("post", "/uploadurl/uploadfile/" + guid, true);    // Set appropriate headers    // We're going to use these in the UploadFile method    // To determine what is being uploaded.    xhr.setRequestHeader("Content-Type", "multipart/form-data");    xhr.setRequestHeader("X-File-Name", file.name);    xhr.setRequestHeader("X-File-Size", file.size);    xhr.setRequestHeader("X-File-Type", file.type);    // Send the file    xhr.send(file);}

And server part:

private UploadedFile[] RetrieveFileFromRequest(){    List<UploadedFile> uploadedFiles = new List<UploadedFile>();    if (Request.Files.Count > 0)    { //they're uploading the old way        for (int i = 0; i < Request.Files.Count; i++)        {            var file = Request.Files[0];            string contentType = file.ContentType;            string filename = file.FileName;            UploadedFile uploadedFile = SaveUploadedFile(file.InputStream, file.ContentLength, filename, contentType);            uploadedFiles.Add(uploadedFile);        }    }    else if (Request.ContentLength > 0)    {        string filename = Request.Headers["X-File-Name"];        string contentType = Request.Headers["X-File-Type"];        UploadedFile uploadedFile = SaveUploadedFile(Request.InputStream, Request.ContentLength, filename, contentType);        uploadedFiles.Add(uploadedFile);    }    return uploadedFiles.ToArray();}

These sources are modification of the original article. There is related stackoverflow question.

How can I organize the form the way it fires some callback when waiting a response is too long?

This is based on your algorithm. You can estimate the time like brute force calculation and show the result before beginning to perform. It's not an optimized solution if you start processing and then break it when too many time is spent!

Update: If you can't estimate like above, At least, write an asynch controller method which is useful when an action must perform several independent long running operations. Follow this:

1. Write an Ajax Form with unobtrusive-ajax
2. Define a function for OnBegin form option to call a timer
3. The timer's time out event will show another thing to user.
4. Write an asynch controller method for the operation whichcontains a timer to stop processing when it takes morethan ?? seconds.