Add Field to Uploader

[knackepizza]

So I would like to create a dropdown to have them select a rating of the file. Where all would I need to add references and things to make this work?

[cubiclesoft]

Pass in some value in 'params'. You'll modify this value later with the actual rating so it doesn't matter what value you set it to.

Use an added callback to insert HTML element(s) and whatever event handlers you need to add for those elements. See the documentation for examples on accessing the row. this is a jQuery object to the DOM row of the added file.

Use a startupload callback to update the form parameters using your HTML elements and then call StartUpload(). If the form data is inaccessible from data, there is an internal $('#thefiles').data('fancy-fileupload').form attribute to access the form element. Even though it is technically internal, it is unlikely to change in the future.

console.log() is your friend for dumping callback variables to the console at each step as well as watching requests in the Network tab.

[knackepizza]

Pass in some value in 'params'. You'll modify this value later with the actual rating so it doesn't matter what value you set it to.

Use an added callback to insert HTML element(s) and whatever event handlers you need to add for those elements. See the documentation for examples on accessing the row. this is a jQuery object to the DOM row of the added file.

Use a startupload callback to update the form parameters using your HTML elements and then call StartUpload(). If the form data is inaccessible from data, there is an internal $('#thefiles').data('fancy-fileupload').form attribute to access the form element. Even though it is technically internal, it is unlikely to change in the future.

console.log() is your friend for dumping callback variables to the console at each step as well as watching requests in the Network tab.

I apologize for replying to this after it was closed, but I can't find your documentation that explains how to use added. I see the one thing in the readme.md, but I don't really know what to do with it.

So I add my dropdown to the list of items in the inforow, and then add its classname to the added callback?

[cubiclesoft]

I closed it because issue trackers are for bug reports. You're free to continue asking questions. I just close out such issues so they aren't distractions from actual bugs.

I made the assumption that you know how to do DOM injection with jQuery. In your added callback, you have access to this - the jQuery object pointing at the row that was just injected into the DOM as well as data with the information of the file that was added to the list. The added callback is the point where you have an opportunity to inject more stuff into the DOM such as a dropdown with options (or a set of stars or whatever). Javascript callbacks are pretty consistent regardless of where you find them. And when in doubt, throw in a console.log(data); or similar to dump a value of interest to the Javascript console and then start drilling into the dumped object in the console. It's not like you can damage anything.

added: function(e, data) {
  console.log(data);

  this.find('.ff_fileupload_fileinfo').after('<div class="myfilerating">Rating: <select><option value="1">1</option><option value="2">2</option><option value="3">3</option></select></div>');
}

[knackepizza]

So I tried doing that and I have added my info to params like so:

'url' : '/add.php',
params: {
    rating: ""
}

And I have the dropdown for rating in the added callback.

added: function(e, data) {
    this.find('.ff_fileupload_fileinfo').after('<select class="rating"><option value="1">1</option><option value="2">2</option></select>');
}

So what more do I need to do to get the values to pass? The dropdown shows up on each file input, but the values for this dropdown don't go anywhere. How do I get it through the ajax call?

[cubiclesoft]

Write a startupload callback that modifies the form data being submitted.