«

I want the file upload element disappear, instead of it, I place a text
box and a button with my own css defination.
but it doesn't work on IE7. What should I do now?
<form action="upload.php" method="POST" enctype="multipart/form-data">
<p>
<span>Select photo:</span>
<input type="file" name="photo" style="display:none;">
<input type="text" name="photoUrl" class="s1" />
<input type="button" class="s2"
onClick="photo.disabled=false;photo.click();photoU rl.value=photo.value;photo.disabled=true"
value="Browse" />
</p>
</form>

On Jun 10, 11:31 pm, GuangXiN <xvt...@gmail.com> wrote:
> I want the file upload element disappear, instead of it, I place a text
> box and a button with my own css defination.
> but it doesn't work on IE7. What should I do now?
> <form action="upload.php" method="POST" enctype="multipart/form-data">
> <p>
> <span>Select photo:</span>
> <input type="file" name="photo" style="display:none;">
> <input type="text" name="photoUrl" class="s1" />
> <input type="button" class="s2"
> onClick="photo.disabled=false;photo.click();photoU rl.value=photo.value;photo.disabled=true"
> value="Browse" />
> </p>
> </form>

turn the button into a anchor you can style that any way you want.

wrote:
> On Jun 10, 11:31 pm, GuangXiN <xvt...@gmail.com> wrote:
>> I want the file upload element disappear, instead of it, I place a text
>> box and a button with my own css defination.
>> but it doesn't work on IE7. What should I do now?
>> <form action="upload.php" method="POST" enctype="multipart/form-data">
>> <p>
>> <span>Select photo:</span>
>> <input type="file" name="photo" style="display:none;">
>> <input type="text" name="photoUrl" class="s1" />
>> <input type="button" class="s2"
>> onClick="photo.disabled=false;photo.click();photoU rl.value=photo.value;photo.disabled=true"
>> value="Browse" />
>> </p>
>> </form>
>
> turn the button into a anchor you can style that any way you want.

Sorry, what I mean is the file upload element doesn't work.
the file upload element's style cannot be set, so I make it unvisiable,
but so it can't send a correct file upload request to web server.

GuangXiN wrote on 11 jun 2008 in comp.lang.javascript:

> wrote:
>> On Jun 10, 11:31 pm, GuangXiN <xvt...@gmail.com> wrote:
>>> I want the file upload element disappear, instead of it, I place a
>>> text box and a button with my own css defination.
>>> but it doesn't work on IE7. What should I do now?
>>> <form action="upload.php" method="POST"
>>> enctype="multipart/form-data">
>>> <p>
>>> <span>Select photo:</span>
>>> <input type="file" name="photo" style="display:none;">
>>> <input type="text" name="photoUrl" class="s1" />
>>> <input type="button" class="s2"
>>> onClick="photo.disabled=false;photo.click();photoU rl.value=photo.valu
>>> e;photo.disabled=true" value="Browse" />
>>> </p>
>>> </form>
>>
>> turn the button into a anchor you can style that any way you want.
>
> Sorry, what I mean is the file upload element doesn't work.
> the file upload element's style cannot be set, so I make it
> unvisiable, but so it can't send a correct file upload request to web
> server.

"Doesn't work" is not an acceptable fraze in this NG, unless you explain
what and how, what debugging tou did, and if and what errorstring and
linenumbers you encountered.

As a security measure, you cannot manipulate the input file element of html
upload forms. Otherwise it would be too easy to secretly upload another
file than the one shown and so compromize the user's private parts.



--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Evertjan. wrote:
> GuangXiN wrote on 11 jun 2008 in comp.lang.javascript:
>
>> wrote:
>>> On Jun 10, 11:31 pm, GuangXiN <xvt...@gmail.com> wrote:
>>>> I want the file upload element disappear, instead of it, I place a
>>>> text box and a button with my own css defination.
>>>> but it doesn't work on IE7. What should I do now?
>>>> <form action="upload.php" method="POST"
>>>> enctype="multipart/form-data">
>>>> <p>
>>>> <span>Select photo:</span>
>>>> <input type="file" name="photo" style="display:none;">
>>>> <input type="text" name="photoUrl" class="s1" />
>>>> <input type="button" class="s2"
>>>> onClick="photo.disabled=false;photo.click();photoU rl.value=photo.valu
>>>> e;photo.disabled=true" value="Browse" />
>>>> </p>
>>>> </form>
>>> turn the button into a anchor you can style that any way you want.
>> Sorry, what I mean is the file upload element doesn't work.
>> the file upload element's style cannot be set, so I make it
>> unvisiable, but so it can't send a correct file upload request to web
>> server.
>
> "Doesn't work" is not an acceptable fraze in this NG, unless you explain
> what and how, what debugging tou did, and if and what errorstring and
> linenumbers you encountered.
>
> As a security measure, you cannot manipulate the input file element of html
> upload forms. Otherwise it would be too easy to secretly upload another
> file than the one shown and so compromize the user's private parts.
>
>
>

OK, let me explain my words.
I wrote a file upload component, but I cannot modify its sytle to what I
want. So I added a textbox and a button with style, and then I make the
file upload component hidden, I want to use script to simulate the file
upload's "Browse" click. I am sure that file select dialog popup when I
click the button. I select a image file, the path and filename did
display in the textbox. But when I click submit, server side script
caught no file.

GuangXiN wrote on 11 jun 2008 in comp.lang.javascript:

>> As a security measure, you cannot manipulate the input file element
>> of html upload forms. Otherwise it would be too easy to secretly
>> upload another file than the one shown and so compromize the user's
>> private parts.
>>
> OK, let me explain my words.
> I wrote a file upload component, but I cannot modify its sytle to what
> I want. So I added a textbox and a button with style, and then I make
> the file upload component hidden, I want to use script to simulate the
> file upload's "Browse" click. I am sure that file select dialog popup
> when I click the button. I select a image file, the path and filename
> did display in the textbox.

As I said, security could be compromized by that.
The browser does not contemplate your possible good intentions.

> But when I click submit, server side script caught no file.

Do serverside scripts catch files? Fire perhaps?

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

On Jun 11, 11:31*am, GuangXiN <xvt...@gmail.com> wrote:
> I want the file upload element disappear, instead of it, I place a text
> box and a button with my own css defination.
> but it doesn't work on IE7. What should I do now?
> <form action="upload.php" method="POST" enctype="multipart/form-data">
> * *<p>
> * * *<span>Select photo:</span>
> * * *<input type="file" name="photo" style="display:none;">
> * * *<input type="text" name="photoUrl" class="s1" />
> * * *<input type="button" class="s2"
> onClick="photo.disabled=false;photo.click();photoU rl.value=photo.value;phot*o.disabled=true"
> value="Browse" />
> * *</p>
> </form>

don't use "disabled",only use "display:none";

Evertjan. wrote:
> GuangXiN wrote on 11 jun 2008 in comp.lang.javascript:
>
>>> As a security measure, you cannot manipulate the input file element
>>> of html upload forms. Otherwise it would be too easy to secretly
>>> upload another file than the one shown and so compromize the user's
>>> private parts.
>>>
>> OK, let me explain my words.
>> I wrote a file upload component, but I cannot modify its sytle to what
>> I want. So I added a textbox and a button with style, and then I make
>> the file upload component hidden, I want to use script to simulate the
>> file upload's "Browse" click. I am sure that file select dialog popup
>> when I click the button. I select a image file, the path and filename
>> did display in the textbox.
>
> As I said, security could be compromized by that.
> The browser does not contemplate your possible good intentions.
Is there any other way to implement what I need? I just need a file
upload component with customs style in css file.

>> But when I click submit, server side script caught no file.
>
> Do serverside scripts catch files? Fire perhaps?
>
PHP has an $_FILES arra. When submit with a file, it will be not null.
I tried to make the file upload component appear and I click the
following button (NOT the Browse button in fileupload component). I can
choose a file and the file upload component show its path correctly.
I click submit and PHP shows that $_FILES is still null.

GuangXiN wrote:
> Evertjan. wrote:
>> GuangXiN wrote on 11 jun 2008 in comp.lang.javascript:
>>>> As a security measure, you cannot manipulate the input file element
>>>> of html upload forms. Otherwise it would be too easy to secretly
>>>> upload another file than the one shown and so compromize the user's
>>>> private parts.
>>>
>>> OK, let me explain my words.
>>> I wrote a file upload component, but I cannot modify its sytle to what
>>> I want. So I added a textbox and a button with style, and then I make
>>> the file upload component hidden, I want to use script to simulate the
>>> file upload's "Browse" click. I am sure that file select dialog popup
>>> when I click the button. I select a image file, the path and filename
>>> did display in the textbox.
>> As I said, security could be compromized by that.
>> The browser does not contemplate your possible good intentions.
> Is there any other way to implement what I need? I just need a file
> upload component with customs style in css file.

This is rather a question for comp.infosystems.www.authoring.stylesheets.
But I am pretty sure you will have to live with the fact that a custom style
cannot be applied to this control in all user agents, and I can't think of a
*viable* alternative.

> PHP has an $_FILES arra. When submit with a file, it will be not null.
> I tried to make the file upload component appear and I click the
> following button (NOT the Browse button in fileupload component). I can
> choose a file and the file upload component show its path correctly.
> I click submit and PHP shows that $_FILES is still null.

Of course. By disabling the file input control you have only caused only
the encoded file path to be submitted per `photoUrl'. A file input control
in a form causes the encoded content of the selected file to be submitted
instead. And if it was possible to set the value of that control with
scripting, any Web site you visit could upload any file from your computed
without your knowing it; you do not want that to happen. (Using
display:none as suggested will not change that.)


PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee

Dan Rumney wrote:
> Thomas 'PointedEars' Lahn wrote:
>> Of course. By disabling the file input control you have only caused only
>> the encoded file path to be submitted per `photoUrl'. A file input control
>> in a form causes the encoded content of the selected file to be submitted
>> instead. And if it was possible to set the value of that control with
>> scripting, any Web site you visit could upload any file from your computed
>> without your knowing it; you do not want that to happen. (Using
>> display:none as suggested will not change that.)
>
> Certainly the risk of being able to set the value of a file input
> control via a script is clear to those who understand its function.

I would not be so sure.

> My interpretation of the OP's request was the following question:
>
> Is it possible to write a script that mimic's a user clicking the upload
> box.

That is assuming that there is always an upload _button_.

> Nothing nefarious... just some way of opening the Open... dialog
> such that the file input control's value will be populated in a
> legitimate fashion.
> [...]
> I thought that the click function would do it, but I think all that does
> is emulate the user clicking at some random point on the control and not
> specifically on the Upload button.
>
> Any thoughts?

ISTM the proprietary click() method is available for input[type="file"]
controls but does nothing at all (in Firefox 2.0.0.14/Gecko 1.8.1.14), not
even emulating a random click anywhere within the control's canvas. In
contrast to clicking directly, the `click' event does not occur for this
control when click() is called. However error-prone, it does occur then for
other types of controls.

This might be another security precaution to prevent an attacker from
selecting a file programmatically.


PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann