Manually doing the UI part for jQuery Upload

I'm able to upload files already with jQuery File Upload, but I'm trying to do the UI part myself for two reasons:

• the look I want is quite different from jQuery UI
• to learn the internals of this plugin a bit more

My problem is I can't seem to figure out the flow needed to complete the following actions after files are dropped:

1. on initUpload, append a list item per file
2. onProgress, display progress of the file upload in its respective list item
3. onLoad, change the list item's text to "Complete"

I've figured out how to do 1 properly:

initUpload: function(event, files, index, xhr, handler, callBack) {
  console.log("here, create list item for " + files[index].fileName);
  callBack();
  return false;
}

My problem is that I don't know how to refer t开发者_StackOverflowhe respective list item after I create the list item. When in either onLoad or onProgress, when I inspect handler (or the other arguments that are passed to those functions), I can't seem to find a way to refer to the respective list item that I want to update.

How do I update each list item properly?

Cheers!

---

Sharing objects between handler callBacks:

• To refer to the list item you can make use of the handler parameter - it is an object that is shared between the different callBack methods, but unique for each individual file upload.
• The handler object contains the file upload settings and is cloned for each file upload initialization.
• An example on how to store additional objects (like the list item or upload row) can be found in the source code of jquery.fileupload-ui.js.

Regarding the UI implementation:

• Even if you make use of both jquery.fileupload.js and jquery.fileupload-ui.js the use of jQuery UI is optional.
• To implement your own progress bar visualization, you can make use of the initProgressBar option.
• The uploadTable/downloadTable and buildUploadRow/buildDonwloadRow options don't have to refer to HTML table and tr elements, but can also represent e.g. HTML ul and li elements.