function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Ted PhanTed Phan 

Integrate jquery-file-upload with visualforce page

Hi guys, 
Maybe this question asked by some guy but I don't find the answer for this yet, so I would like to ask it again with my case.

I have meet a problem with integratiion jquery file upload into visualforce page. I try to use jquery-file-upload to upload files to chatter files. 

Something like this guy did (http://vimeo.com/59395045) but not hack, not using sfc/servelet.shepherd, only using 'services/data/v29.0/chatter/users/me/files' to upload for the files.

I also get a reference from this link
https://developer.salesforce.com/forums/ForumsMain?id=906F000000099QQIAY

But I don't like his suggestion. 

I tried with jquery file upload and I get the error 401-unauthorized when uploading. So, I appreciate any help to make this one work. Thank you.

This is the code I used for upload:

$(function () {
        'use strict';
        // Enable iframe cross-domain access via redirect option:
        $('#fileupload').fileupload(
            'option',
            'redirect',
            window.location.href.replace(
                /\/[^\/]*$/,
                '/cors/result.html?%s'
            )
        );
    
        if (window.location.hostname === 'blueimp.github.io') {
            // Demo settings:
            $('#fileupload').fileupload('option', {
                url: '//jquery-file-upload.appspot.com/',
                // Enable image resizing, except for Android and Opera,
                // which actually support image resizing, but fail to
                // send Blob objects via XHR requests:
                disableImageResize: /Android(?!.*Chrome)|Opera/
                    .test(window.navigator.userAgent),
                maxFileSize: 5000000,
                acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i
            });
            // Upload server status check for browsers with CORS support:
            if ($.support.cors) {
                $.ajax({
                    url: '//jquery-file-upload.appspot.com/',
                    type: 'HEAD'
                }).fail(function () {
                    $('<div class="alert alert-danger"/>')
                        .text('Upload server currently unavailable - ' +
                                new Date())
                        .appendTo('#fileupload');
                });
            }
        } else {
            // Load existing files:
            $('#fileupload').addClass('fileupload-processing');
            $.ajax({
                // Uncomment the following to send cross-domain cookies:
                //xhrFields: {withCredentials: true},
                
                url: $('#fileupload').fileupload('option', 'url'),
                beforeSend: function(xhr) {
                   xhr.setRequestHeader('Authorization', 'Bearer {!$Api.session_ID}');
                },
                dataType: 'json',
                context: $('#fileupload')[0]
            }).always(function () {
                $(this).removeClass('fileupload-processing');
            }).done(function (result) {
                $(this).fileupload('option', 'done')
                    .call(this, $.Event('done'), {result: result});
            });
        }
       
        // Initialize the jQuery File Upload widget:
        $('#fileupload').fileupload({
            // Uncomment the following to send cross-domain cookies:
            //xhrFields: {withCredentials: true},
            url:'/services/data/v29.0/chatter/users/me/files',
            uploadTemplateId: 'template-upload',
            downloadTemplateId: 'template-download'
        });

    });





 

ShashForceShashForce
Hi,

Not sure if it will help, but please see if it gives you any hints: https://developer.salesforce.com/forums/ForumsMain?id=906F000000099XyIAI

Thanks,
Shashank
Elie BuffElie Buff
Hi Ted, 
I'm trying to achieve the same thing as you.
Upload to SF using Jquery File Upload.

Can you please help me with that?
Kamil SzycKamil Szyc
Hi Ted,
It's been two years since you asked the question, have you managed to utilise jquery-file-upload? I am facing the same problem now.
Manohar kumarManohar kumar

Hi Ted, 

I am trying to do the same. Can anyone help me with this. 

Thanks,
Manohar