0

I've generated a form inside a div. I've managed to style the form's input box and the background and border of the button, but I can't seem to be able to change either the value property for the button or the styling so I can change the font colour to something else than black. I have the following basic code to generate the form:

var csvForm = domConstruct.toDom('<div>Load a CSV file:</div><form id="csvUploadForm" class="uploadForm" method="post" enctype="multipart/form-data"> <input type="file" name="data" id="inFileCSVBtn" value="Upload..." /></form>');
domConstruct.place(csvForm, "loadFilesPane");

This code fires up after the body's been created.

I was under the impression that the value property would set the name of the button, but it defaults to 'Browse...'

Is there a way to change the value property to something else and target the button text to style it?

MierMoto
  • 135
  • 1
  • 6
  • 2
    File upload boxes are notoriously hard to style; the usual approach is to make them invisible and put them over top of styled elements, I think. – Ry- Oct 01 '13 at 00:19

1 Answers1

0

A similar question was asked here on StackOverflow

Here is a quick link to their solution at Quirksmode.org

Community
  • 1
  • 1
SunnyD
  • 23
  • 4
  • Hey @SunnyD, I tried this but it removes the input box and replaces the entire form with one big button. I need the box and button combo, but I need to also be able to style the button. – MierMoto Oct 01 '13 at 03:45
  • I've actually found a proposed [answer](http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom) further down that page, which might suit me. It actually handles the button styling quite well. I've just started playing around with it, but it seems to be the go. So, not sure if your answer is the correct one, but it lead me onto it. The moderators can decide. – MierMoto Oct 02 '13 at 02:36