CODEWITHSUNDEEP
javascriptjqueryfile-uploaduploadfine-uploader
rhughes
rhughes

Reputation: 9583

FineUploader button text

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--;
        }
    });

Upvotes: 0

Views: 3577

Answers (3)

Albert Anstett
Albert Anstett

Reputation: 183

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.

Upvotes: 4

JNo
JNo

Reputation: 395

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>

Upvotes: 6

egig
egig

Reputation: 4430

try using an element:

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

good luck !

Upvotes: 1

Related Questions