Coloring input type=file browse button; uploading multiple files

Discussion in 'HTML' started by Ron Brennan, May 10, 2004.

  1. Ron Brennan

    Ron Brennan Guest

    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.
     
    Ron Brennan, May 10, 2004
    #1
    1. Advertising

  2. "Ron Brennan" <> wrote:

    > 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.)

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, May 10, 2004
    #2
    1. Advertising

  3. Ron Brennan

    Ron Brennan Guest

    "Jukka K. Korpela" <> wrote in message
    news:Xns94E69D3239AAjkorpelacstutfi@193.229.0.31...
    > "Ron Brennan" <> wrote:
    >
    > > 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.)
    >
    > --
    > Yucca, http://www.cs.tut.fi/~jkorpela/
    > Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
    >

    -------------------------------------------------
    "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.
     
    Ron Brennan, May 10, 2004
    #3
  4. Ron Brennan wrote:
    > 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>
     
    Disco Octopus, May 10, 2004
    #4
  5. Ron Brennan

    Ron Brennan Guest

    "Disco Octopus" <> wrote in message
    news:VLTnc.2029$...
    > Ron Brennan wrote:
    > > 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?
     
    Ron Brennan, May 11, 2004
    #5
  6. Ron Brennan wrote:
    > "Disco Octopus" <> wrote in message
    > news:VLTnc.2029$...
    >> 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, May 11, 2004
    #6
  7. Disco Octopus wrote:
    > Ron Brennan wrote:
    >> "Disco Octopus" <> wrote in message
    >> news:VLTnc.2029$...
    >>> Ron Brennan wrote:
    >>> 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?



    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>
     
    Disco Octopus, May 11, 2004
    #7
  8. "Ron Brennan" <> wrote:

    > "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.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, May 11, 2004
    #8
  9. "Disco Octopus" <> wrote:

    > <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).

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, May 11, 2004
    #9
  10. Ron Brennan

    Neal Guest

    On Tue, 11 May 2004 05:45:46 +0000 (UTC), Jukka K. Korpela
    <> wrote:

    > 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.
     
    Neal, May 11, 2004
    #10
  11. Ron Brennan

    Mark Parnell Guest

    Mark Parnell, May 11, 2004
    #11
  12. Ron Brennan

    Neal Guest

    On Tue, 11 May 2004 16:11:11 +1000, Mark Parnell
    <> wrote:

    > On Tue, 11 May 2004 02:02:38 -0400, Neal <> declared in
    > alt.html:
    >> On Tue, 11 May 2004 05:45:46 +0000 (UTC), Jukka K. Korpela
    >> <> wrote:
    >>> 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.

    >
    > I believe Jukka meant number 3.
    >



    Only one that could apply. I caught that shortly after posting...
     
    Neal, May 11, 2004
    #12
  13. Ron Brennan

    B r ia n Guest

    On Tue, 11 May 2004 02:02:38 -0400, Neal <> wrote:

    >> 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.


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

    --
    The more laws and order are made prominent,
    The more thieves and robbers there will be.
    --Lao-tzu
     
    B r ia n, May 11, 2004
    #13
  14. Jukka K. Korpela wrote:

    > _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.

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
     
    Toby A Inkster, May 11, 2004
    #14
  15. Jukka K. Korpela wrote:
    > "Disco Octopus" <> wrote:
    >
    >> <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).


    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.
     
    Disco Octopus, May 11, 2004
    #15
  16. Ron Brennan

    Jeff Thies Guest

    > > <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


    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
     
    Jeff Thies, May 11, 2004
    #16
  17. "Disco Octopus" <> wrote:

    > 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.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
     
    Jukka K. Korpela, May 11, 2004
    #17
  18. 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.
     
    Disco Octopus, May 11, 2004
    #18
  19. Ron Brennan

    donghead Guest

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

    > 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:
    >
     
    donghead, May 11, 2004
    #19
  20. Jukka K. Korpela, May 11, 2004
    #20
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Mathew George
    Replies:
    1
    Views:
    675
    Randy Charles Morin
    Sep 15, 2003
  2. John Scalco
    Replies:
    1
    Views:
    415
    Steve C. Orr [MVP, MCSD]
    Jun 9, 2004
  3. Ron Brennan
    Replies:
    5
    Views:
    316
    Dr John Stockton
    May 14, 2004
  4. Replies:
    3
    Views:
    207
    desprateCoder
    Oct 13, 2006
  5. Replies:
    0
    Views:
    213
Loading...

Share This Page