Add additional parameters to send to server using fineuploader

Question

I am using http://fineuploader.com/ to upload a file. Works perfect. I then set params in the request object to send some additional parameters to be sent to the server. Works perfect. I then add another parameter to send using setParams with the onSubmit callback. Doesn't work perfect as it deletes my original parameters. My desire is to add this last parameter to the original parameters, not replace them. My newPar is a dynamic valve, and not a constant as shown in my example.

Should I just not attempt to define parameters in the request object and do it all in the callback? Or set my added parameters in the request object using an anonymous function? Or maybe some other way?

var uploader = new qq.FineUploaderBasic({
    button: document.getElementById('uploader'),
    autoUpload: false,
    multiple:false,
    request: {
        endpoint: 'uploads/handleUploads.php',
        params: {id:123,task:'upload'}
    },
    callbacks: {
        onSubmit: function(id, fileName) {
            this.setParams({newPar:321});
        }
    },
    debug: true
});

Unsaddle

Answer 1

Your best bet would be to extend the default parameters ({ id: 123, task: 'upload' }) in the onSubmit with any new parameters. Here is an example:

// set your default parameters for all files via
// some object/function visible in fineuploader's scope
var defaultParams = {
    id: 123,
    task: 'upload'
}
var uploader = new qq.FineUploaderBasic({
    multiple: false,
    debug: true,
    autoUpload: false,
    button: document.getElementById('uploader'),
    request: {
        endpoint: "uploads/handleUploads.php",
    },
    callbacks: {
        onSubmit: function (id, fileName) {
            // Extend the default parameters for all files
            // with the parameters for _this_ file.
            // qq.extend is part of a myriad of Fine Uploader
            // utility functions and cross-browser shims
            // found in client/js/util.js in the source.
            var newParams = {
                newPar: 321
            },
                finalParams = defaultParams;

            qq.extend(finalParams, newParams);
            this.setParams(finalParams);
        }
    }
});

Fine Uploader has a ton of utility functions (docs/code), and I used one of them -- extend -- to help create our final parameters object (assuming you are not using jQuery or any other dependencies).

Edit: Realized that you were not setting params for a specific file, but for all files, dynamically.

Carducci

Thanks Mark, Your recommendation works, but so do my two solutions I posted in my original post. Do you think I should consistently use the approach you show? Thanks – Unsaddle

This seems simple enough. Although it absolutely depends on your use case, I guess. The disadvantage of setting params in the request is that they can be overwritten (I'm giving some thought to as to whether that is a bug or not) using setParams. There may be cases where you would want to have default params set in the request but change if some condition is met in a callback. – Carducci

Maybe a future method called addParams? Is it possible to add params to request, and then extend that obj instead of adding the new obj defaultParams? – Unsaddle

Is there a specific reason you need to add parameters to the request option rather than extending them and calling setParams? – Carducci

I use fineuploader on multiple pages. Typically, I don't need to dynamically add something, so use request. This is the only time I needed to do differently. Just like to be consistent when possible. – Unsaddle

Ok. I understand. I can definitely see how it would seems that setParams would extend request.params. setParams only applies to the current request, though, and it isn't difficult to extend the default. – Carducci