Any workarounds for the Safari HTML5 multiple file upload bug?

Question

After weeks of tweaking I finally gave up. I just couldn't fix my multiple file upload on safari, which really bothered me because my code worked perfectly as it should on other browsers, except on safari. Then I have just recently discovered that its not my code that has the problem. Its a Safari bug. Safari 5.1.+ can't read the html5 multiple attribute (or something like that). So users can't use the multiple upload feature, BUT, can properly upload a single file.

few links that discuss the issue:

https://github.com/moxiecode/plupload/issues/363

file input size issue in safari for multiple file selection

It seems that this bug has been around for quite some time. So I was wondering if there are workarounds available for this at the moment that some of you maybe are aware of? Because I can't find any. The only option available i found is to NOT use multiple attribute for Safari 5.1.+ users. Do you guys have any better ideas?

UPDATE

Safari 5.1.7 is the last version Apple made for the Windows OS. They did not continue to build current versions of Safari for Windows. Finding a fix for this bug for me is not necessary since Real Safari users are updated to the latest version of the browser(no facts), and just give a separate upload for those who are still using this outdated version, to not sacrifice the modern features of your application.

Answer 1

This is oldish question, but ... hack-type workaround is below.

Just remove multiple attribute for Safari, turnig it into MSIE<=9 little brother (non-XHR).

Rest of browsers will not be affected.

When Safari finally fixes problem, all you have to do is remove this hack::code and go back to standard input code.

here is standard input sample:

<input class="fileupload-input" type="file" name="files[]" multiple />

jQuery solution:

Just place it somewhere on a page, where you have files input tag.

you may read more here: How to detect Safari, Chrome, IE, Firefox and Opera browser?

$(document).ready(function () { 
    if (Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor')>0);
         $('.fileupload-input').removeAttr("multiple");
});

PHP solution

you will need some code to id browser I used a class I got one in github (MIT) get it here: https://github.com/gavroche/php-browser

 $files = '<input class="fileupload-input" type="file" name="files[]" multiple />';
 if (Browser::getBrowser() === Browser::SAFARI) {
    $files = '<input class="fileupload-input" type="file" name="files[]" />';
 }
echo $files

That is all.