I have a form with some data and upload. The upload could be initiated only if data were successfully received and processed. To do that, I make an ajax call where I
- send data,
- check its result,
- trigger a click() to open a file dialog box.
The last thing with click() doesn't work as it seems that asynchronous call blocks opening an upload window. It works only if I set async: false
.
I cannot find anything in documentation and this site and want to know what is the problem there and how to make it working keeping the call asynchronous?
Example:
$.ajax({
type: "POST",
url: "/Save",
data: jsonText,
dataType: "json",
//async: false [1]
}).done(function (msg) {
$("#upload").click();
});
//$("#upload").click(); [2]
Demo: http://jsfiddle.net/c2v00uxn/
Note:
- if I uncomment [1] or [2], it does work (the file dialog appears as expected).
- replace click() with trigger('click') doesn't work
- replace click() with live()/on() doesn't help
- file upload control is visible as per example (so it's not because of hidden control)
- timeout settings for ajax do not help.
UPDATE
It's not about how to make a "click" in general, it's about how to click after an asynchronous ajax call (as of now, works only with non-asynchronous call).
$("#upload").click();
are still in the call stack created by the user generated event (the click of the button that triggers the ajax). The ajax really has nothing to do with your problem — the done handler is firing successfully. It's essentially the same as running$("#upload").click();
in the console. – Bryan Downing Apr 24 '15 at 8:16