Customize the labels of a file input


Topic: Customize the labels of a file input

neocheck pro premium asked 2 weeks ago

I want to customize the labels of a label type input but I don't know what properties to manipulate.

The element is:

<input type="file" name="file" class="form-control" accept="image/*,.doc,.docx,.pdf" onchange="checkFileSize(this)" multiple="" required="" id="customFile1">

enter image description here


Kamila Pieńkowska staff answered 2 weeks ago

What do you want to customise? Text of the label or appearance?


neocheck pro premium commented 2 weeks ago

We need customise the text of the label in the input


Kamila Pieńkowska staff answered a week ago

This text is browser-controlled and depends on the language. No attribute will allow you to change it. You can either add a label above the input or hide the native text with CSS and use the custom button with your text to trigger the file input field.


neocheck pro premium commented a week ago

How would you do the recommended? Can you give me an example?


Kamila Pieńkowska staff commented a week ago

https://mdbootstrap.com/snippets/standard/kpienkowska/6424590


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 3.10.2
  • Device: Notebook
  • Browser: Google Chrome
  • OS: Windows 11
  • Provided sample code: No
  • Provided link: No