I had a look, as you've probably noticed, it has duplicated the whole form, and then used the same class for those two. in my case, the widgets are embedded in one form, beside other model attributes, and it doesn't feel good to have multiple forms in one view for one model! :-? and even if I do so, I'll had to edit your code in XUpload.php, where you have registered the starter JS for this plugin.
what about the second way? is there any DOM attribute anywhere holding the destination action, so wen can change it in client side? like by checking a checkbox, that attribute would change from 'uploadImage' to 'uploadFile' ?
alternatively, I'll try to solve this problem using bootstrap tabs, having different form in each tab, and hoping that no conflicts would happen
You don't really have 1 model in that view, do you? at minimum you have 2, one for Article, and another for Attachments, Ideally you'd have models for Image, File, etc, as they all have different metadata.
The additional data you have is for the Article right? so the forms can be separated easily, what I'd do Is have the Article form on top, and after that a section containing 'Article Assets' or 'Article Attachments' which will hold the forms for your other files. Also remember that this is asynchronous upload, since those assets are related to your article you should probably create the article first. please take a look at this wiki for an idea of how to do that.