0

I have scoured the FineUploader documentation, but when I set my upload button text like below, the change does not seem to propagate. The upload button still displays the default text. What am I missing?

var manualuploader = new qq.FileUploader({
        element: document.getElementById('manual-fine-uploader'),
        text: {
            uploadButton: "Select a File" // <========== Setting text here
        },
        action: "/file/upload",
        autoUpload: false,
        multiple: false,
        forceMultipart: true,
        onComplete: function (id, fileName, json) {

            $("#divFileUploadLoading").hide();
            $("#buttonUploadFile").show();

            if (json.success) {

                displaySuccessMessage("Successfully uploaded: " + fileName);

                $("#textFileTitle").val("");
                $("#textFileDescription").val("");
                $("#checkIsDownloadable").prop("checked", true);
                $("#checkDisplayDetails").prop("checked", true);
            }
            else {

                displayErrorMessage("Failed to upload: " + fileName + " because '" + json.errorMessage + "'");
            }

            g_FileCount = 0;

            manualuploader.clearStoredFiles();
            manualuploader.reset();
        },
        onSubmit: function (id, fileName) {

            g_FileCount++;
        },
        onCancel: function (id, fileName) {

            $("#divFileUploadLoading").hide();
            $("#buttonUploadFile").show();

            displaySuccessMessage("Canceled upload for: " + fileName);

            g_FileCount--;
        }
    });
3
  • Any errors in the console? Commented Mar 18, 2013 at 14:56
  • @ShadowWizard No. In fact, everything works just fine. Just the text is not setting.
    – rhughes
    Commented Mar 18, 2013 at 15:16
  • Any way for you to set up jsfiddle demo reproducing the problem? On quick look it appears that library cost money, in which case you deserve personal support from the library developers. Commented Mar 18, 2013 at 15:19

3 Answers 3

6

Tested and verified. You still need to use the "text" option.

text: {
  uploadButton:'<div>Select a file</div>'
}

Another way to do it is to create your own button with the button: option.

JS:

button: document.getElementById('my-button')

HTML:

<div id="my-button" class="qq-upload-button">Select a file</div>
4

As far as I'm concerned, the provided answers do not work. So what I did was to set the contents of the corresponding division programmatically after having called the FineUploader constructor. My Javascript is as follows (using jQuery):

$('div_ID').fineUploader({... your options here });
$(".qq-upload-button-selector.qq-upload-button div").text("your custom text");

I have tested this and it works for me. Any comments welcome.

Hope this helps.

1
  • It looks like the text > uploadButton is no longer supported if you are using a javascript template. This solution worked for me. Commented May 14, 2018 at 21:50
1

try using an element:

uploadButton: "<div>Select a File</div>"

good luck !

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.