Bootstrap Filestyle - Changing button text for file field doesn't work

Question

I would like to change button text for file field in Bootstrap Filestyle plugin in Bootstrap 2.3.2, but it doesn't work and text of button is still default. I create file field by replacing element in jquery and tried to set text by attribute data-buttonText or method $("#changeAccountsSourceModal :file").filestyle('buttonText', 'Choose address');

jsfiddle sample

File field

$("#changeAccountsSourceModal .form-horizontal").replaceWith("<input type=\"file\" class=\"filestyle\" data-input=\"true\" data-buttonText=\"Choose address\">");

$("#changeAccountsSourceModal :file").filestyle();

Answer 1

Just tried it out by passing the option in an object on initiating filestyle, works.

$("#changeAccountsSourceModal :file").filestyle({buttonText: 'Choose address'});

Ironically when you try to change the vaule afterwords the text just gets added to the button.

$("#changeAccountsSourceModal :file").filestyle('buttonText', 'Choose address');

fiddle

working fiddle

Answer 2

You can change button text, remove icon, placeholder and more

$(document).ready(function () {
    $("#myInputId").fileinput({
        mainClass: "input-group-md",
        showUpload: false,
        previewFileType: "image",
        browseClass: "btn btn-sucess",
        browseLabel: "Select Photo",
        browseIcon: "<i class=\"icon-picture\"></i> ",
        removeClass: "btn btn-danger",
        removeLabel: "Delete",
        removeIcon: "<i class=\"icon-trash\"></i> ",
        uploadClass: "btn btn-info",
        uploadLabel: "Upload",
        uploadIcon: "<i class=\"icon-upload\"></i> ",
        msgPlaceholder: "Select Photo"
    });
});