0

I am using a plugin called Window postMessage Plugin along with UploadiFive to upload a file to my server and insert the file link onto a webpage that has my upload script embedded on it. It works great on desktop devices (tested in Firefox (v26) and Chrome (v31) ).

When I try it on my iPad (running iOS 7.0.4 using Safari) and my Android Phone (running Android 4.3 stock browser) the file uploads as intended but it doesn't insert the file as it should. Any ideas why it works on my desktop but not mobile?

Here is my code:

JS

This JS is to get the file name from the upload script, target where to insert the file, and then insert code based on file type. 

pm.bind("message5", function(data) {
    var ext = data.split('.').pop().toLowerCase();
    myFrame = $('#editorf').contents().find('body');
    nestedFrame = myFrame.find('#re_contentIframe').contents().find('body');

    if (ext=='jpg' || ext=='jpeg' || ext=='bmp' || ext=='gif' || ext=='png' || ext=='tiff' || ext=='tif'){  
     nestedFrame.append($.parseHTML(' <br><br> <a href="http://www.domain.net/uploads/' + data + '" class="fancybox"><img style="max-width:250px;" class="forum-image" src="http://www.domain.net/uploads/' + data +'"/></a>'));
    } else if (ext=='pdf') {
        nestedFrame.append($.parseHTML('  <br><br> <a target="_blank" href="http://www.domain.net/uploads/' + data + '">View Uploaded PDF</a>'));
    } else {
        nestedFrame.append($.parseHTML('  <br><br> <a href="http://www.domain.net/uploads/' + data + '">Download Uploaded File</a>'));
    }
});

UploadiFive JS

$('#file_upload').uploadifive({
            'formData'     : {
                'timestamp' : '<?php echo $timestamp;?>',
                'token'     : "<?php echo md5('unique_salt' . $timestamp);?>"
            },
            'uploadScript' : '/js/uploadify/uploadify.php',
            'onUploadComplete' : function(file, data) {
                var fileUploaded = data;
                pm({
                  target: window.parent,
                  type: "message5", 
                  data:fileUploaded 
                });
            }
        });

How do I get this to work on mobile devices?

Note: I am using jQuery 2.0.3.

UPDATE

To attempt and debug the problem I tried to use Edge Inspect. When I ran the code through Edge Inspect it worked! It just doesn't work in the stock browsers from what I can tell on iOS and Android. I am baffled as to why.

L84
  • 45,514
  • 58
  • 177
  • 257
  • Sorry, a bit late here - but I think you will find Uploadifive doesn't actually work on iPads. I was just testing it (and searching around), and for me even the demo doesn't work – Andrew Newby Jun 27 '14 at 08:06
  • @AndrewNewby - I ended up adding a notice to the site for mobile devices that says the upload may not function on your device. If you ever do find a solution would love to see it. – L84 Jun 27 '14 at 20:17
  • I ended up using this on my project, which works well across all devices: http://blueimp.github.io/jQuery-File-Upload/ – Andrew Newby Jun 28 '14 at 16:36

0 Answers0