Add formData before upload

[iruindegi]

Hi, this is my controller:

    var uploader = $scope.uploader = $fileUploader.create({
        scope: $scope,                          
        url: '/doUpload',
        formData: [
            {
                key: 'value',
                izena:''
            }
        ]
    });

What I need is to include a new field called "izena" where I have my upload path and more data.

This is all the stuff I tried on "beforeupload" event:

    uploader.bind('beforeupload', function (event, item) {
        console.info('Before upload', item);
        var temp_izena = items[0].file.name;
        var izena = temp_izena.substr(0, temp_izena.lastIndexOf('.'));
        izena = izena + datuGuztiak;
        $('#izena').val(izena);
        $('#izena').text(izena);
        uploader.formData.push({ izena: izena });
        uploader.formData.izena = "jejejjejej";
        item.izena = "jajajjaj";
    });

but it is not working.. I can not see this param on my request on node.js

Whitch is the correct way to add new fields to upload?

thanks in advance

[dstollie]

I'm running into the exact same problem as iruindegi does.. I cant modify the formData property after i instantiated the fileUploader

this is what i try to do:

$scope.submit = function () {
    $scope.uploader.formData.push({
        categoryId: scope.properties.category.documentCategoryId
    })
    $scope.uploader.uploadAll();
};

[nervgh]

Hi, @iruindegi

When a file is added to the queue, settings of uploader are copied to him. You need to change the item options:

uploader.bind('beforeupload', function (event, item) {
    item.formData.push({some: 'data'});
});

#84
#65

[lasergoat]

That's a great answer @nervgh

My issue was for each file, I wanted to send an additional field called title.

In my controller I did:

        $scope.titles = [];

        uploader.bind('beforeupload', function (event, item) {

            index = uploader.getIndexOfItem(item);

            item.formData.push({title: $scope.titles[index]});
        });

        uploader.bind('complete', function (event, item) {
            $scope.titles = [];
        });

Then, the view can have the input field in the queue table from the "simple example" (http://nervgh.github.io/pages/angular-file-upload/examples/simple)

<tr ng-repeat="item in uploader.queue">
    <td>
           <strong>{{ item.file.name }}</strong><br/>
           <input type="text" ng-model="titles[$index]" />
    </td>
    ...

Now the issue is that if there are two files, the 'complete' event is run after the first file uploads, so the title goes away before the second item can be posted. Is there a way to know when all items in the queue are complete and then clear my titles?

Thanks!

PS: here's a screenshot of the queue with the inputs:

[ikerib]

it works for me, thanks!

[nervgh]

@polyesterhat

Is there a way to know when all items in the queue are complete and then clear my titles?

You could use the removeAfterUpload propery #99 (comment) or completeall event.

[pmgtech]

This should be added to an example. The docs don't really make it clear. Ended up getting stumped for quite a bit on this :(

[nervgh]

@pmgtech, You can ask your question as new issue.

[onlypradeep]

Hi,
We are unable to add/upload a second file when using IE9. No problems when uploading first file.
Works good in >IE9 and other browsers. Is it a known issue? How to fix this?

[philecom]

I am lst to where to place this code
uploader.bind('beforeupload', function (event, item) {
item.formData.push({some: 'data'});
});
I get undefined is not a function,

I hope you can help me.

[JimmyFarcy]

Hi i have try to add into the formData my token to certify the right to access to that url from the user.
To do so i try to use

    uploader.bind('beforeupload', function (event, item) {
    item.formData.push({some: 'data'});
});

But i got this error

" TypeError: $scope.uploader.bind is not a function"

Thank for you help

[Silver360]

Hi, i have the same problem.
"uploader.bind is not a function"
Any idea what is wrong?

[Kiranrajkathula]

if i enter any formdata part in the code, im getting this problem.. pls help!

[quangnhatt]

Hi, how can I get formData in controller (asp.net mvc)?

[parsipixel]

" TypeError: $scope.uploader.bind is not a function"

I solved the problem by using this function instead of bind :

$scope.uploadImage = function (item) {
        item.formData.push({id: $scope.data._id});
        item.upload();
    };

Push formdata before uploading the item.

[ainasiart]

@quangnhatt Hi, how can I get formData in controller (asp.net mvc)?
After "pushing" your data in the formData, you can get it from you MVC controller using
Request.Form

[stangudu1808]

How can i read the physical path location of the each file? and How can i read the bytearray or stream of the each file to store into the DB? Any help on this is appreciate

[vivek1108]

How can i add an image clicked from mobile directly into the uploader queue for uploading

[JiabinYuan]

@JimmyFarcy
Hi, I got the same error, " TypeError: $scope.uploader.bind is not a function"
do you kown how to fix it?
Thank for you help

[IanYoder]

I was able to update the form data using onBeforeUploadItem():

var fileUploader = new FileUploader();

fileUploader.onBeforeUploadItem = function(fileItem) {
    fileItem.formData.push({ data: 'data' });
};

[vamsivarikuti]

onBeforeUploadItem is going into infinite loop, any idea?

[evaldovega]

uploader.onBeforeUploadItem=function(item){
item.formData.push({ref:$scope.nuevo.ref});
}