Coloring input type=file browse button; uploading multiple files

[Ron Brennan]

Good afternoon.

The entire task that I'm trying to achieve is to allow a user to browse and
upload multiple files simultaneously, hiding the Browse button of <input>
tags of type="file" and replacing it with a button of my own background
color and text.

The file paths I'd like displayed in a textarea and then the files uploaded
at once.

The code chunks toward my goal I got from the Web (below) I think worked
before IE 5.0 but for me produces an "Access Denied" error.

Can anybody help with any part of my problem (coloring the browse button,
listing multiple chosen files in a textarea, uploading an artibrary number
of files at once)?

Thanks, Ron.

 

[Jukka K. Korpela]

The entire task that I'm trying to achieve is to allow a user to
browse and upload multiple files simultaneously, hiding the Browse
button of <input> tags of type="file" and replacing it with a button
of my own background color and text.

Well, just stop trying that. File input is confusing enough to users,
partly because it _is_ complex, partly because implementations are lousy.
No reason to mess things up any more by attempts to change the appearance
of widgets.

The code chunks toward my goal I got from the Web (below) I think
worked before IE 5.0 but for me produces an "Access Denied" error.

Below what? If you tried to insert a copy of some code, it failed, and
you should have posted a URL instead.

Can anybody help with any part of my problem (coloring the browse
button, listing multiple chosen files in a textarea, uploading an
artibrary number of files at once)?

Write a new browser. The browser that comes closest to a decent
implementation of input type=file is Opera, but there's a lot to be
improved there. And make the browser free and so good that most people
want to get it. Sit back and wait for a couple of months, or years.

Alternatively, live with the existing limitations. If the intent is to
allow submission of multiple files, you might encourage your visitors to
zip their file collections and just submit the zipped file. You would
naturally have to unzip the stuff somehow. The details depend on what you
are really doing. (I guess it wouldn't be too difficult to make a form
handler unzip a file automatically and process the individual files.)

 

[Ron Brennan]

Well, just stop trying that. File input is confusing enough to users,
partly because it _is_ complex, partly because implementations are lousy.
No reason to mess things up any more by attempts to change the appearance
of widgets.


Below what? If you tried to insert a copy of some code, it failed, and
you should have posted a URL instead.


Write a new browser. The browser that comes closest to a decent
implementation of input type=file is Opera, but there's a lot to be
improved there. And make the browser free and so good that most people
want to get it. Sit back and wait for a couple of months, or years.

Alternatively, live with the existing limitations. If the intent is to
allow submission of multiple files, you might encourage your visitors to
zip their file collections and just submit the zipped file. You would
naturally have to unzip the stuff somehow. The details depend on what you
are really doing. (I guess it wouldn't be too difficult to make a form
handler unzip a file automatically and process the individual files.)

-------------------------------------------------
"If you tried to insert a copy of some code, it failed, and you should have
posted a URL instead."

The code is actually embeded in a servlet. In regards to the other comments,
the objective is to make the pages as attractive and easy to use as
possible. I am just trying to find out what is possible, and that I haven't
thought of or found.

 

[Disco Octopus]

Good afternoon.

The entire task that I'm trying to achieve is to allow a user to
browse and upload multiple files simultaneously, hiding the Browse
button of <input> tags of type="file" and replacing it with a button
of my own background color and text.

The file paths I'd like displayed in a textarea and then the files
uploaded at once.

The code chunks toward my goal I got from the Web (below) I think
worked before IE 5.0 but for me produces an "Access Denied" error.

Can anybody help with any part of my problem (coloring the browse
button, listing multiple chosen files in a textarea, uploading an
artibrary number of files at once)?

Thanks, Ron.

this code may be helpful if you want to do a multiple file upload....

<html>
<head>
<script type="text/javascript">
function addafile(){
vp = document.getElementById("poobear");
vp.innerHTML += "<p><input name=\"eeyore[]\"
type=\"file\"></p>";
}
</script>
</head>
<body>
<p><input name="tigger" type="submit" onclick="addafile();" value="do
it"></p>
<div id="poobear"></div>
</body>
</html>

 

[Ron Brennan]

Good afternoon.

The entire task that I'm trying to achieve is to allow a user to
browse and upload multiple files simultaneously, hiding the Browse
button of <input> tags of type="file" and replacing it with a button
of my own background color and text.

The file paths I'd like displayed in a textarea and then the files
uploaded at once.

The code chunks toward my goal I got from the Web (below) I think
worked before IE 5.0 but for me produces an "Access Denied" error.

Can anybody help with any part of my problem (coloring the browse
button, listing multiple chosen files in a textarea, uploading an
artibrary number of files at once)?

Thanks, Ron.

this code may be helpful if you want to do a multiple file upload....

<html>
<head>
<script type="text/javascript">
function addafile(){
vp = document.getElementById("poobear");
vp.innerHTML += "<p><input name=\"eeyore[]\"
type=\"file\"></p>";
}
</script>
</head>
<body>
<p><input name="tigger" type="submit" onclick="addafile();" value="do
it"></p>
<div id="poobear"></div>
</body>
</html>

--------------------------------------
Im sorry, but I'm obviously not understanding what this is doing. It seems
to me to be sending nothing to the server. When the user presses trigger,
the browser inserts the input element but sends the request to the server
even before the user has an opportunity to press the <input> browse button.
Where am going wrong?

 

[Disco Octopus]

Ron Brennan wrote:
this code may be helpful if you want to do a multiple file upload....

<html>
<head>
<script type="text/javascript">
function addafile(){
vp = document.getElementById("poobear");
vp.innerHTML += "<p><input name=\"eeyore[]\"
type=\"file\"></p>";
}
</script>
</head>
<body>
<p><input name="tigger" type="submit" onclick="addafile();"
value="do it"></p>
<div id="poobear"></div>
</body>
</html>

--------------------------------------
Im sorry, but I'm obviously not understanding what this is doing. It
seems to me to be sending nothing to the server. When the user
presses trigger, the browser inserts the input element but sends the
request to the server even before the user has an opportunity to
press the <input> browse button. Where am going wrong?

no. i was just giving you an example of a potential way to have someone
upload multiple files. all they do is click the button to make new input
fields, and then you can work out the rest. yes? no?

 

[Disco Octopus]

no. i was just giving you an example of a potential way to have
someone upload multiple files. all they do is click the button to
make new input fields, and then you can work out the rest. yes? no?

i see what you mean... i think.... try this then.....

<html>
<head>
<script type="text/javascript">
function addafile(){
vp = document.getElementById("poobear");
vp.innerHTML += "<p><input name=\"eeyore[]\"
type=\"file\"></p>";
}
</script>
</head>
<body>
<p><input name="tigger" type="button" onclick="addafile();" value="add
a thing"></p>
<div id="poobear"></div>
<p><input name="otherthing" type="submit" value="send them now"></p>
</body>
</html>

 

[Jukka K. Korpela]

"If you tried to insert a copy of some code, it failed, and you
should have posted a URL instead."

Why did you quote my entire message and _then_ a separate statement, in a
quotation style that deviates from Usenet conventions? You didn't even
answer that statement:

The code is actually embeded in a servlet.

What code? And you still didn't explain the "(below)" part.

Hints for Usenet conduct: http://www.cs.tut.fi/~jkorpela/usenet/dont.html

In regards to the other
comments, the objective is to make the pages as attractive and easy
to use as possible.

You did not address any of the content of my comments. That's actually
typical. Comprehensive quoting is an almost sure sign of lack of
comprehensive reading.

I am just trying to find out what is possible,
and that I haven't thought of or found.

As you wish. That won't take you closer to making the pages attractive,
and especially not closer to making them easy to use.

 

[Jukka K. Korpela]

<body>
<p><input name="tigger" type="button" onclick="addafile();"
value="add
a thing"></p>
<div id="poobear"></div>
<p><input name="otherthing" type="submit" value="send them
now"></p>
</body>

Now you have a body that contains a button which, when clicked on, does
nothing, and a submit button that submits empty data - unless the user is
careless enough to have client-side scripting enabled (too few virus
experiences?) _and_ happens to use a browser that supports a suitable
version of a scripting language _and_ guesses what's going on (instead
of, say, moving quickly away when a page starts behaving in an odd way).

 

[Neal]

What code? And you still didn't explain the "(below)" part.

Hints for Usenet conduct: http://www.cs.tut.fi/~jkorpela/usenet/dont.html

I'm having trouble determing which of the 7 rules he's violated.

 

[Mark Parnell]

I'm having trouble determing which of the 7 rules he's violated.

I believe Jukka meant number 3.

 

[Neal]

I believe Jukka meant number 3.

Only one that could apply. I caught that shortly after posting...

 

[B r ia n]

I'm having trouble determing which of the 7 rules he's violated.

I just love that he can link any situation, or any mistake that anyone
can make at anytime to something on his website =P

 

[Toby A Inkster]

_and_ happens to use a browser that supports a suitable
version of a scripting language

.... and happens to support the non standard DOM extension innerHTML.

 

[Disco Octopus]

Now you have a body that contains a button which, when clicked on,
does nothing, and a submit button that submits empty data - unless
the user is careless enough to have client-side scripting enabled
(too few virus experiences?) _and_ happens to use a browser that
supports a suitable version of a scripting language _and_ guesses
what's going on (instead of, say, moving quickly away when a page
starts behaving in an odd way).

right. whatever. its obviously not going to do much without the form. and do
you really think it needs the brower to have client-side-scripting turned
on? this was just to give the op something to play with / an idea perhaps in
his quest.

 

[Jeff Thies]

Now you have a body that contains a button which, when clicked on, does
nothing, and a submit button that submits empty data

How can it submit anything when there isn't even a form?

I think what the OP intended was to create as many input type file's as may
be needed. That's not such a bad thing to do that with javascript provided
there is a fall through and it actually works. This is a long way from
working...

Jeff

 

[Jukka K. Korpela]

right. whatever.

Apparently you don't care whether your "advice" is right or wrong. Please
keep using lowercase-only as a useful bogosity signal then.

its obviously not going to do much without the form.

Actually it is, if scripting is enabled, though it will not do anything
_useful_.

and do you really think it needs the brower to have
client-side-scripting turned on?

I am not surprised at seeing that you have to ask such things.

this was just to give the op
something to play with / an idea perhaps in his quest.

A wrong idea, to be more exact.

 

[Disco Octopus]

Jukka K. Korpela typed:

Please keep using lowercase-only as a useful bogosity signal then.

why do you care that i write in lowercase? why do you say that my input is
bogus? i think that you are a prick, but i certainly would not say that in
a public forum just because i didn't understand what you were trying to
communicate.

 

[donghead]

shut up you miserable pin head. get a life. OOOOH I top posted better tell
the usenet police!

 

[Jukka K. Korpela]

why do you care that i write in lowercase?

As I explained, it is a useful bogosity signal. Please continue using a
fake name as well. Thank you in advance.