Format "Choose File" button for a text field of File type

I was wondering if it’s possible to change the format of the button that shows up when you assign “File” to a text field? I would like it to match the buttons in the rest of my theme.

I was thinking maybe I could do that in the Widget Style editor but it seems that only affects the file name text and the background of the whole widget.

All the standard form elements take their basic styling from whatever browser and OS combination you are using.

Right, but is there a way to apply custom colors, font, etc within Axure?

As you don’t actually see the button in Axure so there’s nothing you can do to style it. To be quite honest, it can be a bit of a swine when using css as there is no actual element to target within the rendered html. After the prototype using external changes would be the only way to do it and that would most likely be best achieved using javascript.

Hi,

I find out one solution here. I hope it will be useful for you.

Demo
For your reference
Nick-Bewley’s-Freshy-File-Upload-with-Variables.zip (57.6 KB)

1 Like

@Vikramadhithan - this is an interesting solution. Thank you for sharing. I was hoping to not use js but will give this a try.

Hi!
Is there any chance that you could update your example file to last version of Axure. Unfortunately your file is not working with Axure 8 :frowning:

I too would also like to have an updated file of this. Thanks!

1 Like

Hi Sebastian.Zarnowski and aserd,

This isn’t Vikram’s file, but here’s an approach that may help:

Note that that Gregor’s solution in the above thread does involve a bit of JavaScript, but the same concept should be able to be adapted to cover a “File” textfield with another widget or image.

I hope this is helpful!