Closed matrad closed 9 years ago
FileDrop doesn't assume anything about browser capabilities. It sets all things up as if it supports both drag & drop and iframe. Once an event occurs FileDrop uses the corresponding mechanism to send the file.
This means that you can't determine what method FileDrop will use beforehand unless you manually check user agent or use some other tentative techniques. This also means that if user clicks on the drop zone, triggers file open dialog and this triggers iframe upload - this doesn't mean that the browser doesn't support drag & drop, it merely means the user has chosen not to drop the file but to select it in the dialog.
However, if the user does drag & drop and it works - you can be sure that the browser supports both methods.
If checking these capabilities when the event occurs works for you then you can do something like this:
myfiledrop.preview('upload', function (e) {
if (this.eventFiles(e, true)) {
alert('Will use AJAX to upload')
} else {
alert('Will fall back to IFrame upload')
}
})
I think it's wise for FileDrop to only expose this stuff in context at execution time. If you have other code that hinges on drag & drop support, you should make that assertion without relying on FileDrop's API (even if FileDrop's implementation details are also contingent on the same thing). Personally I would use Modernizr.
To add to @barneycarroll's answer, if you specifically need drag & drop upload then you are better off disabling iframe as described in the docs. This gives you great flexibility (you can turn any element into a drop zone and style it) and you can forget about legacy stuff. So far only IE 10 and before is a problem.
Ok, that makes sense. What I wanted to display a different text when using the fallback method in the guy to tell that drag & drog support is not available.
But may there a Bug in the current Version? Because on IE<10 the Drag & Drop support is enabled, it only stops when setting the Global isIE9 to true manually. Otherwise it sends a POST Request with no data.
window.fd = {isIE9: true};
This I read on the main Page:
Disabled drag & drop for Internet Explorer 10 and below — even if they fire ondrop they actually send empty POST body upon submission. Regular
Also, drag & drop was verified to work in Opera 12.15.
What I wanted to display a different text when using the fallback method in the guy to tell that drag & drog support is not available.
You can assume that it's enabled but also listen to upload and checking if eventFiles returns anything as I've demonstrated above - if it doesn't but upload is triggered nevertheless then you can tell the user he's using the fallback upload. Otherwise there's no build-in FileDrop way of checking available upload mechanisms before it's actually used.
But may there a Bug in the current Version?
You have quoted exactly the piece of documentation that tells why drag & drop is disabled in IE10 and before. IE is broken: even if they [IE6-10] fire ondrop they actually send empty POST body upon submission. Therefore its support is artificially disabled as there is no way to get the dropped file's data even though events are triggered properly.
That's ok, but have I to set the var window.fd = {isIE9: true};
manually?
Shouldn't this detected automatically? Because by default, if I not set this variable to true manually on IE9, then on IE9 the drag & drop isn't disabled.
Because by default, if I not set this variable to true manually on IE9, then on IE9 the drag & drop isn't disabled.
Do you mean that the file still gets uploaded with empty POST data? Are you sure you're not enabling some compatibility mode or anything that could make IE behave differently? According to my previous tests isIE9 was correctly set and drag & drop was disabled. If you're saying it's not - I will need to test it again.
No, it was not. I'm testing it with IE11, IE9 mode.
Also the Flag on IE8 is not set (native), where Drag&Drop also not works.
I have checked and isIE* are properly set. They are not set in Compat Modes because IE changes the way JS is processed (pseudocomments with @_jscript_version
don't seem to work) but I don't want to fix this because compatibility modes are bound to be gone. Hardly anybody uses them anyway. In Edge mode everything seems to be fine.
Is it possible to check if File Drag & Drop is supported or if we're sending via iFrame callback?
Does there exist a global Info Var? I didn't found anything in the documentation