progerxp / filedrop Goto Github PK

I've got a lot of code that expects uploads to come in with multipart/form-data formatting, but filedropjs seems to always send just the raw data alone. Are there any settings I'm missing to force mpfd?

Hey all,
It seems that filedrop is considering the XHR to be in error if its statusCode is strictly different of 200, which is quite restrictive. Servers might respond with 201 Created or any 2XX status code, and the response should still be correct.
Do you want me to submit a pull request ?

Exploring the net looking fo interesting options for IE 7/8 support and I came upon this site. It looks promising, however the page loads with a javascript error and the drag and drop doesn't appear to work.

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64; x64; Trident/4.0; .NET CLR 2.0.50727; SLCC2; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)
Timestamp: Thu, 17 Apr 2014 13:31:05 UTC

Message: Syntax error
Line: 26
Char: 10
Code: 0
URI: http://filedropjs.org/demo/

I uploaded a file 120mb and chrome just dies.

The problem in this case is (in prepareInput()) the line:
if (target && global.isTag(global.byID(target), 'iframe')) {

Here global.byID(target) can't find the iframe because the parent DOM is not inserted into the global DOM. It should be like baseNode.findByID(target)

Had trouble figuring out how to get dragEnter/dragLeave using the jQuery integration till I dug into the source, and noticed that the event name is being lowercased in addition to having the fd or file prefix attached. I didn't see this in the docs anywhere.

I'm setting up a file repository type module in one of my apps and am using a combination of jQuery FileTree and FileDrop to allow the end user to upload files to multiple folders by displaying multiple drop zones. However, The CSS that is recommended for use with .fd-file seems to overlap zones and destroy the functionality of the click / browse. Has anyone tweaked this CSS to allow zone overlaps?

In this page, I find out that FileDrop work with IE9.
http://filedropjs.org/
http://filedropjs.org/demo/
"IFrame fallback for legacy agents (IE 6+)"
However, I have been trying to use drag/drop with IE9 but It seem don't work.
Can you help me?
Anw, are there any live demo for FileDrop which working in IE9.

I've been trying your great script for D&D uploading in IE9, however when I try to do so on IE9 the upload seems to trigger the iframeDone event as expected, but states that 0 bytes were received. I've been trying to resolve the issue, and the only thing i could find is that

$_SERVER['HTTP_X_FILE_NAME'] and  file_get_contents("php://input");

come out empty, I thought it was due to my hosting setup, but I'm getting the same result on your site aswell. I hope this is described properly if you need any details don't hesitate to let me know.

I thought this was a feature, but it turned out to be a bug.
Steps to reproduce using the "File Explorer" (no drag and drop):

• Select file1 to be uploaded and check that it is uploaded;
• Select file1 again and check that this is not triggering the change event in the file input;

But you can upload the same file if you simple select another one between them:

• Select file1 to be uploaded and check that it is uploaded
• Select file2 to be uploaded and check that it is uploaded
• Select file1 (the same file) to be uploaded and check that it is uploaded

This fix should be something like:

self.opt.input.file.value = ""

Hello,
all is in the title, i try to drag and drop a message directly from Outlook, and drop it into the demo page
but it dont seem to work correctly, there is no problem detected but the download dont occur

could you explain to me the reason and if its even possible with such a drag and drop please

best regards

Is there a reason to override the Content-type when uploading the file?
self.xhr.setRequestHeader('Content-Type', 'application/octet-stream')

And in addition to that, why you prefer to send the raw data?
e.target.result

Those two piece of code doesn't seem to work properly when you upload a PNG file (probably other binary files too). Why not just sending the nativeFile and let the XMLHTTPRequest handle the Content-Type?
The way it is now is making all file unused as the server doesn't know the mime-type to save it properly...

Thanks for filedrop! Your hard work is very much appreciated!

The documentation here:

http://proger.i-forge.net/FileDrop_-_cross-browser_JavaScript_Drag-Drop_file_upload/7CC

has the parameters for "progress" as function (current, total,xhr,e)

I am using them with jquery,

.on(fileprogress)

and the parameters actually appear to be ordered (xhr,e,current,total)

... I am not sure about the order of the xhr and the e - but current and total are definitely the last two.

Is this just a documentation glitch, or a query thing, to have I misunderstood?

Hi,

I tested the filedrop and the demo http://filedropjs.org/demo/ in iOS7 without problems but after the update to iOS8 nothing happens after selecting a file to upload. The file selection box appears correct.

Note: tested in standard safari browser on iphone 5 and ipad 2 with iOS8.

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

I believe the issue I am experiencing is related to the April change log which reads:

"dropping file in IE now doesn’t trigger upload since IE doesn’t fill with the dropped file name"

I want to confirm that this behavior is actually the result of this change. What I am experiencing is as follows:

I am trying to create a simple proof of concept using FileDrop and I found an issue in IE8 which I can easily reproduce using the demo page.

When the page is first loaded in IE dragging a file to the drop area does not trigger an http request as I would expect. In FF & Chrome it does send the request. If you click in the drop area to be shown the file selection dialog choose a file and upload a request is sent as expected.

After this action you can now successfully drag and drop files into the drop area in IE; but not until you manually choose a file from the dialog first.

I don't see any errors occurring in developer tools. Setting iframe forced = true does not seem to resolve the behavior.

I am really happy with filedrop - I have implemented an interactive upload into my site using it, and the results are A-mazing! I, however, want to leverage more common standards such as PUT and DELETE.

Can I tell FileDrop to use PUT for the AJAXy requests and POST for iFrame?

I am using couchdb jquery api.
With normal input type file, I am saving image as attachment with ajaxsubmit request .

HTML::

JS::

$('#form_id').ajaxSubmit({
// Submit the form with the attachment
url: "/"+ database_name +"/"+ couchdb_document_id,
success: function(response) {
console.log("success");
},
error: function(data, error, reason) {
console.log("error");
}
});

Now I want to save dropped file. but I am getting base64 encoded string, which is representing the image.

I want to drooped image as a file object. How can I get same file object for dropped element, as I am getting while uploading with input type file.

I would like to use the jQuery interface but how is it possible to get the server's response on 'filedone'? I would like the server to rename the uploaded file to avoid collisions and pass the new name back to the web page.

Simply use XHR object given to 'done' event as in $().on('filedone', function (e, file, xhr)) - e.g. its responseText field to get whatever was output by the server. Note that it won't work for iframe (if you're using it) - see the docs for iframeDone and the comment about filedone in the source code around the end of the file.

I'm having problems compressing filedrop.js using YUI Compressor:

[I]> java -jar yuicompressor-2.4.8.jar --type js --charset utf-8 filedrop.js
[ERROR] in filedrop.js
  568:66:missing } after property list
[ERROR] in filedrop.js
  569:11:syntax error
[ERROR] in filedrop.js
  573:14:syntax error
[ERROR] in filedrop.js
  577:12:syntax error
[ERROR] in filedrop.js
  578:4:syntax error
[ERROR] in filedrop.js
  603:10:syntax error
[ERROR] in filedrop.js
  1385:9:missing ) after argument list
[ERROR] in filedrop.js
  1385:10:syntax error
[ERROR] in filedrop.js
  1579:3:syntax error
[ERROR] in filedrop.js
  1590:10:syntax error
[ERROR] in filedrop.js
  1831:3:syntax error
[ERROR] in filedrop.js
  1834:10:syntax error
[ERROR] in filedrop.js
  1835:10:syntax error
[ERROR] in filedrop.js
  1849:10:syntax error
[ERROR] in filedrop.js
  2375:3:syntax error
[ERROR] in filedrop.js
  2385:10:syntax error
[ERROR] in filedrop.js
  2389:11:invalid return
[ERROR] in filedrop.js
  2390:3:syntax error
[ERROR] in filedrop.js
  2466:10:syntax error
[ERROR] in filedrop.js
  2467:8:syntax error
[ERROR] in filedrop.js
  2468:13:missing ; before statement
[ERROR] in filedrop.js
  2470:7:syntax error
[ERROR] in filedrop.js
  2471:44:missing ; before statement
[ERROR] in filedrop.js
  2476:7:syntax error
[ERROR] in filedrop.js
  2489:19:invalid return
[ERROR] in filedrop.js
  2491:19:invalid return
[ERROR] in filedrop.js
  2506:17:invalid return
[ERROR] in filedrop.js
  2515:13:invalid return
[ERROR] in filedrop.js
  2516:5:syntax error
[ERROR] in filedrop.js
  2521:1:syntax error
[ERROR] in filedrop.js
  1:0:Compilation produced 30 syntax errors.
org.mozilla.javascript.EvaluatorException: Compilation produced 30 syntax errors.
    at com.yahoo.platform.yui.compressor.YUICompressor$1.runtimeError(YUICompressor.java:172)
    at org.mozilla.javascript.Parser.parse(Parser.java:396)
    at org.mozilla.javascript.Parser.parse(Parser.java:340)
    at com.yahoo.platform.yui.compressor.JavaScriptCompressor.parse(JavaScriptCompressor.java:315)
    at com.yahoo.platform.yui.compressor.JavaScriptCompressor.<init>(JavaScriptCompressor.java:536)
    at com.yahoo.platform.yui.compressor.YUICompressor.main(YUICompressor.java:147)
    at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
    at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
    at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
    at java.lang.reflect.Method.invoke(Method.java:606)
    at com.yahoo.platform.yui.compressor.Bootstrap.main(Bootstrap.java:21)

It fails on these lines:

    isIE6: /*@cc_on/*@if(@_jscript_version<=5.7)true@else@*/false/*@end@*/,
    isIE9: /*@cc_on/*@if(@_jscript_version<=9)true@else@*/false/*@end@*/,

I commented on an existing YUI Compressor issue but I don't expect them to do anything about it soon: yui/yuicompressor#119 (comment)

Is there any workaround for this? Perhaps another method of IE detection?

when fullDocDragDetect is set to true, I was expecting that I could drag my file to any place in the document and it would upload, but instead the browser opens the file.

you can see this happening with chrome (which defaults to fullDocDragDetect: true) on the example here:
http://filedropjs.org/#reacting

If that's how it is supposed to work, then the css is not consistent, because the "over" class gets added to "fd-zone" container even when the file won't be uploaded.

It's now possible to drag-drop and entire folder from the desktop when using Chrome.

http://codebits.glennjones.net/dragdrop/dropfolder.htm

Trying to test the progress bar as per the zone10 sample in the homepage with a 1.7GB file.

Unfortunately I never see the progress bar, but I see the logs in the server and it seems the browser is loading the file into memory before it even starts the upload (taking about 160 seconds).

Once the upload starts it only takes 8 seconds (going to localhost ;-)

So basically a whole of time waiting with no indication that anything is happening except that I do see the inputSetup event in the JS console.

Any ideas? Is there a way to just do the upload without loading the file into memory?

This is using firefox in Ubuntu 14.04.

Thanks,

Alberto

It would be nice to have the fallback css (without the pretty box) as a single file, so it can be included easier via bower.

Hi,

I have a zone which I drag and drop files onto (basically the whole screen). This zone also contains a list of the files I've uploaded, which can be reordered by drag and drop too.

In Chrome, the events onDrop and onDragEnter are never triggered. They are caught by filedrop which prevents their propagation. Is there any way to allow the event propagation so that I can actually use drag and drop for different purposes than drag and dropping a file onto my page ? Thanks

I encountered an issue with multiple file upload on iOS reproduced on the online demo. Although I can choose several files, only one is uploaded. Please find the debug:

The script https://blueimp.github.io/jQuery-File-Upload/ has not such issue so I believe it's not a iOS limitation.

I tried the plugin on various browser and works excellent :) But i was a having a problem when i was actually going to save the uploaded file as the $_FILES gives me an empty value. Not sure if i am doing something wrong but i just used the demo files provided on the downloaded folder.

-- i had closed the this because this is not really an issue, as this is just because of my lack of knowledge :D

Thanks,
Lawrence

hey there.

Due to using PHP and preffering the standard $_FILES method, I decided to force iFrame uploads. But upon doing so, I realized very quickly, that only one upload works. After that, any subsequent requests will not work. What could be the cause for this?

Kind regards, Ingwie

Is there a way to install your plugin via bower, since I seem to be unable to find it with bower search? Would you be so kind to add it there?

Is it possible to add a property to disable the check for file size > 0?

I want to show a error for the user when he selects a file with size 0. Because the actual behavior, of ignoring those files, may lead the user to think that it is not working and then try again.

This is a reminder for me about "broken support" link reports.

syntax error on line 26, character 10.
Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64; x64; Trident/4.0; .NET CLR 2.0.50727; SLCC2; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; ..NET4.0E) 

Last two tests failed.
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.7; rv:27.0) Gecko/20100101 Firefox/27.0 

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.117 Safari/537.36

IE9 did not work!
Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64; x64; Trident/4.0; .NET CLR 2.0.50727; SLCC2; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; Tablet PC 2.0) 

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/534..57.7 (KHTML, like Gecko) Version/5.1.7 Safari/534.57.7

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537..74.9 (KHTML, like Gecko) Version/7.0.2 Safari/537.74.9

Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:27.0) Gecko/20100101 Firefox/27.0

Safari 7.01 build 9537.73.11 (latest stock version)

Safari for iOS 

Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_3) AppleWebKit/537.75.14 (KHTML, like Gecko) Version/7.0.3 Safari/537.75.14

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_3) AppleWebKit/537.76.4 (KHTML, like Gecko) Version/7.0.4 Safari/537.76.4

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:29.0) Gecko/20100101 Firefox/29.0

Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; InfoPath.3; .NET4.0C)

Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36

Mozilla/5.0 (Windows NT 5.1; rv:12.0) Gecko/20100101 Firefox/12.0
used with Firefox 12 windows xp sp2. but uploading failed

Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)

Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.124 Safari/537.36

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_1) AppleWebKit/600.2.5 (KHTML, like Gecko) Version/8.0.2 Safari/600.2.5

Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:30.0) Gecko/20100101 Firefox/30.0

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/600..6.3 (KHTML, like Gecko) Version/8.0.6 Safari/600.6.3

Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.124 Safari/537.36

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.130 Safari/537.36

It should be possible to set X-Requested-With (or just an option for not setting it)

I have server-side code (which I cant change in the near future) which checks if X-Requested-With equals XMLHttpRequest for determining if the request is an ajax request.

Is there a way to reset the FileDrop object instance? Or destroy it to instantiate a new instance?

The unminified version of filedrop.js has lint errors, found using jshint, from version downloaded here: http://github.com/ProgerXP/FileDrop/archive/master.zip

Loaded in the browser, there are "missing semicolon" errors. Workaround, use filedrop-min.js.

   public/js/filedrop.js
     12 |    define(['exports'], function (exports) { init(root, exports) })
                                                                         ^ Missing semicolon.
     12 |    define(['exports'], function (exports) { init(root, exports) })
                                                                            ^ Missing semicolon.
     14 |    init(root, exports)
                                ^ Missing semicolon.
     16 |    init(root, root.fd = root.fd || {})
                                                ^ Missing semicolon.
     29 |    return (prefix || 'fd') + '_' + (Math.random() * 10000).toFixed()
                                                                              ^ Missing semicolon.
     30 |  }
            ^ Missing semicolon.
     38 |    do { var id = global.randomID(prefix) } while (global.byID(id))
                                                  ^ Missing semicolon.
     38 |    do { var id = global.randomID(prefix) } while (global.byID(id))
                                                                        ^ 'id' used out of scope.
     38 |    do { var id = global.randomID(prefix) } while (global.byID(id))
                                                                            ^ Missing semicolon.
     39 |    return id
                    ^ 'id' used out of scope.
     39 |    return id
                      ^ Missing semicolon.
     40 |  }
            ^ Missing semicolon.
     53 |    return global.isTag(id) ? id : document.getElementById(id)
                                                                       ^ Missing semicolon.
     54 |  }
            ^ Missing semicolon.
     81 |           ( !tag || element.tagName.toUpperCase() == tag.toUpperCase() )
                                                                                  ^ Missing semicolon.
     82 |  }
            ^ Missing semicolon.
     90 |      return new XMLHttpRequest
                          ^ Missing '()' invoking a constructor.
     90 |      return new XMLHttpRequest
                                        ^ Missing semicolon.
     95 |                     'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP']
                                                                    ^ Missing semicolon.
     99 |          return new ActiveXObject(activex[i])
                                                       ^ Missing semicolon.
    100 |        } catch (e) {}
                           ^ Value of 'e' may be overwritten in IE 8 and earlier.
    104 |    throw 'Cannot create XMLHttpRequest.'
                                                  ^ Missing semicolon.
    105 |  }
            ^ Missing semicolon.
    120 |    return Object.prototype.toString.call(value) === '[object Array]'
                                                                              ^ Missing semicolon.
    121 |  }
            ^ Missing semicolon.
    155 |      return []
                        ^ Missing semicolon.
    158 |      value = [value]
                              ^ Missing semicolon.
    161 |    return Array.prototype.slice.call(value, skipFirst || 0)
                                                                     ^ Missing semicolon.
    162 |  }
            ^ Missing semicolon.
    181 |        element['e' + type + callback] = callback
                                                          ^ Missing semicolon.
    183 |          element['e' + type + callback](window.event)
                                                               ^ Missing semicolon.
    184 |        }
                  ^ Missing semicolon.
    185 |        element.attachEvent('on' + type, element[type + callback])
                                                                           ^ Missing semicolon.
    187 |        element.addEventListener(type, callback, false)
                                                                ^ Missing semicolon.
    191 |    return element
                           ^ Missing semicolon.
    192 |  }
            ^ Missing semicolon.
    199 |    event.cancelBubble = true
                                      ^ Missing semicolon.
    200 |    event.returnValue = false
                                      ^ Missing semicolon.
    201 |    event.stopPropagation && event.stopPropagation()
                                                            ^ Expected an assignment or function call and instead saw an expression.
    201 |    event.stopPropagation && event.stopPropagation()
                                                             ^ Missing semicolon.
    202 |    event.preventDefault && event.preventDefault()
                                                          ^ Expected an assignment or function call and instead saw an expression.
    202 |    event.preventDefault && event.preventDefault()
                                                           ^ Missing semicolon.
    203 |    return event
                         ^ Missing semicolon.
    204 |  }
            ^ Missing semicolon.
    219 |    if ((element = global.byID(element)) && className != null) {
                                                               ^ Use '!==' to compare with 'null'.
    221 |        element.className = element.className.replace(global.classRegExp(className), ' ')
                                                                                                  ^ Missing semicolon.
    223 |        element.className += ' ' + className
                                                     ^ Missing semicolon.
    227 |    return element
                           ^ Missing semicolon.
    228 |  }
            ^ Missing semicolon.
    246 |    return global.classRegExp(className).test( (global.byID(element) || {}).className )
                                                                                                ^ Missing semicolon.

If possible, can this library be made nodejs-flavour commonjs compatible and published to npm, so that we can do npm install filedrop --save and write a million things that need drag-and-drop file handling? It would make the life of an automation engineer a lot easier =D

Is there a built-in support or is it something that can be done using an external library?

ArrayBuffer is deprecated in XMLHttpRequest.send(). Use ArrayBufferView instead.

Please.

this is reproducible in mozilla firefox v28

Why you are not using e.srcElement.files on IE to retrieve the files?

In the function self.eventFiles there is the following line:

var list = e.target && e.target.files

Why this is not the following:

var list = e.target && e.target.files || e.srcElement && e.srcElement.files

So you can retrieve the file list on IE too.

Files bigger than ~200kb are failing after ~1-2 minutes with this error message:

SCRIPT7002: XMLHttpRequest: Network Error 0x2ef3, Could not complete the operation due to error 00002ef3.

It doesn't happen with Chrome or Firefox on the same VM. I'm using the modern.ie VMs for virtualbox on OSX Mavericks.

IE11
Version: 11.0.9600.16438
Update Versions 11.0.1 (KB2888505)

I had the same problem with IE10 on win7, but I didn't do that much tests.

I think FileDrop is amazing.
Apple have recently changed Photos App on a Mac.
Drag and Drop support not working. Just wondered if anyone had spotted it and thought of a fix. Browse works. But that's not quite as good as dragging and dropping.

Our server endpoint returns 201 HTTP status code, but filedrop.js considers this as an error and calls the error handler. Given the semantics, this should be considered success and call the file.event("done", ...) listener.

hi there,

I upload large files using Filedrop, some of them are like 100MB. I can actually zip them and my app layer can unzip and import the files, but the problem is, this process takes long, sometimes 30min or close to an 1hr when I notice that the file(s) are uploaded again to the server.

Am using Chrome, but I assume this is a feature in Filedrop to repeat the upload when the request times out? Can anyone help please?

I'd like to use FileDrop in a commonjs environment, specifically Browserify. I tried the following expecting it to work:

var FileDrop = require('filedrop');

however this simply returns an empty object. It appears FileDrop only attaches itself to window and doesn't follow any modern module pattern (AMD or CommonJS). By making this library UMD compatible you will only need to expose FileDrop in the global scope if running in a non AMD or non CommonJS environment.

In addition to being a library that supports legacy browsers as well as modern ones, I would like to be able to use FileDrop as a library that supports only legacy browsers or a library that supports only modern browsers. Ideally I would like to load these conditions via separate scripts.

1. Demo page does not work on IE9, because the callback script is not run. When you run the callback yourself (window.top.fd_1234 type of calls) by copying from the server response, it works well.

I have been dealing with this problem since yesterday, the problem is:

2. This specific iFrame does not have top or parent context. The iFrame created thinks it is a standalone frame and does not have a parent window, nor has a frameElement. So fd_1234 is undefined because window.top = window and window.parent = window, right side being the iFrame's own window context.

I encountered the problem on IE9 so far, modern browsers seem to be working fine when options.iframe.force = true. I still couldn't come up with a solution, but it already cost me hours and hours...

Any ideas?

One possible explanation may be: http://msdn.microsoft.com/en-us/library/gg622929(v=vs.85).aspx
How I reached the MSDN article: http://stackoverflow.com/questions/5514973/javascript-code-in-iframes-in-ie9-not-working

Hello!

I need filedrop to allow user to upload only txt files.
Does filedrop have options to set allowed file extenstions to upload?

I'd like to use FileDrop loading it with require('filedrop') can you make it a npm package please?

http://filedropjs.org/demo/#progress
This example doesn't work on IE 9.0. Is this an issue or FileDrop simply doesn't support for IE 9.0?