You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@struts.apache.org by Michael McGrady <mi...@michaelmcgrady.com> on 2004/08/24 04:18:33 UTC

Solution to Image for Browse Button in

The solution is in the capitalized HTML.  This has been tested and 
works.  There is a slight problem with Opera browsers, because they do 
not support opacity.  This still works but the facade form is covered by 
the form that really works.  The way this works is to let the normal 
operations be conducted by the real form while what the user sees is the 
form facade.  The downside is that you cannot see changes to the text 
which are done manually, since those changes are in fact happening to 
the real form, which is invisible.

Michael McGrady

<html>
    <head>
        <title>
            UPLOADER BROWSE BUTTON IMAGE TEST
        </title>
        <meta http-equiv="Content-Type" content="text/html; 
charset=iso-8859-1">
        <SCRIPT TYPE="text/javascript">
            function fillfacadeForm()
            {
                document.forms['facadeForm'].myFileText.value= 
document.forms['realForm'].uploadFile.value;
            }
        </SCRIPT>
        <STYLE TYPE="text/css">
            .fileUpload {
            -moz-opacity:0 ;
            filter:alpha(opacity: 0);
            -khtml-opacity: 0;
            }
        </STYLE>
    </head>
    <body bgcolor="#FFFFFF" text="#000000"><br>
        <SPAN STYLE="position: absolute; middle: 10px; left: 
10px;z-index: 1;">
            <FORM
                NAME="realForm"
                ACTION="browse.html"
                METHOD="post"
                ENCTYPE="multipart/form-data">
                <INPUT
                    TYPE="hidden"
                    NAME="fileOp"
                    VALUE="fileValue">
                <INPUT
                    TYPE="file"
                    CLASS="fileUpload"
                    NAME="uploadFile"
                    ONKEYUP="fillfacadeForm();"
                    ONMOUSEOUT="fillfacadeForm();">
                &nbsp;&nbsp;&nbsp;
                <INPUT
                    TYPE="image"
                    NAME="submit"
                    VALUE="fileValue"
                    SRC="submit.gif">
            </FORM>
        </SPAN>

        <SPAN STYLE="position: absolute; middle: 10px; left: 10px; 
z-index: 0;">
            <FORM NAME="facadeForm">
                <INPUT TYPE="text" NAME="myFileText">
                <IMG SRC="browse.gif" BORDER="0">
            </FORM>
        </SPAN>
    </body>
</html>



---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org