File Download and GWT Look and Feel Control

Question

I am writing my first GWT project. I have a form with a caption, a download control file and a download button, but they look awful and too different in different web browsers. Also, the button from the file upload control does not have the same style as the GWT button control. Another problem is that in the Chrome Button to select the file is on the left?!?

What can I do about it?

Download file in Internet Explorer :

Download file in Internet Explorer http://www.stackoverflow.com.s3.amazonaws.com/FileUploadIE.png

Download files in Firefox :

Download Firefox file http://www.stackoverflow.com.s3.amazonaws.com/FileUploadFirefox.png

Download files in Chrome :

Download the Chrome file http://www.stackoverflow.com.s3.amazonaws.com/FileUploadChrome.png

Answer 1

<input type="file">It will look different in different browsers. That is how they and we should live with him.

But I do not think it really needs to be worried. If someone decides to work with the browser, they decide to work with the appearance of the browser, including rendering<input type="file">.

It is also not possible to change the button styles of this control (in order / clean). A.

-, , . <input type="file"> - , (), . , , (, ".doc" ".docx", )

- : - . , . (2- ) YUI ( ), , GWT . .

Answer 2

, , <input type='file' /> . FileUpload .

, - .

• .
• - ( , ), FileUpload - .
• , , getFilename() FileUpload.

, , .

Answer 3

quirksmode, , CSS , , .

, , ( ) . , , Clickjacking.

Answer 4

. " " html . . javascript/jquery .

HTML: -

<input id="file" type="file" style="display: none;">
<button id="button">Add file</button>

JAVASCRIPT: -

$('#button').click(function(){
    $('#file').click();
});

CSS: -

#button
{
    background-color: blue;
    color: white;
}

JS : - http://jsfiddle.net/32na3/