Upload button appears when not called- but i have 2 instances

Question

I have created 2 instances of S3 uploader in a page and i have given them different div names. One of the instances is set to auto upload and the other is set to manual upload with edit file names set.

However the instance with auto upload is pulling the upload button from the other instance as well. It sits there and does nothing because the upload works as intended- automatically. Other than this rogue button both forms work as i want.

This is the div for the button but i only have it in one instance

<div id="triggerUpload-feeds" class="qq-upload-button start-upload" style="margin-top: 10px;cursor:pointer;">Upload</div>

Answer 1

Fine Uploader UI looks for a template in the document with an ID of "qq-template". Therefore, both uploaders are being constructed from the same template. If you want multiple uploaders on the same page that pull from different templates, you'll need to ensure you define multiple templates in your markup, each with a different ID. You'll then need to reference the appropriate template when you construct each Fine Uploader UI instance.

For example:

<script type="text/template" id="qq-template1">
<!-- template markup here -->
</script>

<script type="text/template" id="qq-template2">
<!-- template markup here -->
</script>

<script>
var uploader1 = new qq.FineUploader({
    template: 'qq-template1'
});

var uploader2 = new qq.FineUploader({
    template: 'qq-template2'
});
</script>

For more info, see the templating/styling feature page in the docs.