Add additional values when uploading via jQuery

Chris Hill

July 07, 2016 02:45

Hi,

I'm currently successfully uploading video/images with the jquery file upload system in an angular app. I do not want to upload the rather large video files to your cloud, but instead trim them first (among other things). But I cannot determine how to modify the form data of the file upload object after calling unsigned_cloudinary_upload(). Nor can i determine how to update the form data afterwards. I have attempted to use cloudinary_fileupload()/fileupload() afterwards but this has not done anything. Changing the formData via fileupload() complains with an initialization error (and your angular example does the same btw).

I am currently using the method mentioned here to turn off auto upload:
https://support.cloudinary.com/hc/en-us/articles/202519982-Images-are-automatically-uploaded-upon-selection-How-can-I-disable-it-

Afterwards I'm displaying a form that the user can modify to trim the video, and then I would like to send those values.

I have created a gist here:

https://gist.github.com/robotron2084/bdabcc5026f39350e188fa79c345c72d

Any help would be great!
Thanks

0

• 

  Chris Hill

  July 07, 2016 18:08

  Well it turns out the problem was very, very sneaky. This should also most likely fix your angular example as well. It looks like the object returned from the series of on() calls is not the same value as $(".cloudinary_fileupload"). I fixed the issue by doing:

  $scope.widget = $(".cloudinary_fileupload"); $scope.widget.unsigned_cloudinary_upload(cloudinary.config().upload_preset, {}, {
  ...etc...

  It took me way too long to figure this out because the object returned from the on() calls looks identical to the value returned from $(".cloudinary_fileupload"), even in the debugger.

  It was only until I did this:

    var thing1 = $(".cloudinary_fileupload");
    var thing2 = $scope.widget;
    var thingsAreSame = thing1 == thing2;
    //thingsAreSame is false
  

  That I saw it return false.

  0
• 

  Chris Hill

  July 07, 2016 18:29

  Follow-up: apparently I need to always grab the variable via $(".cloudinary_fileupload") instead of storing the value in $scope.widget. I'm not exactly sure, because I'm newish to JS and all this method chaining is new to me.

  0

Post is closed for comments.