Re: HTML5 Forms Question

Discussion in 'HTML' started by Adrienne Boswell, Jun 17, 2010.

  1. Gazing into my crystal ball I observed Ed Jay <>
    writing in news::

    > I'm using HTML5 Forms to select multiple files for uploading:
    >
    ><form id='form2' name='form2' action="/cgi-bin/upload.pl\"
    >method='post'
    > enctype='multipart/form-data'>
    >
    ><input type='file' name='myFile0' id='myFile0' value='' multiple
    >min='0'
    > max='99' files=''>
    >
    ><input type=submit value='Upload Files'>
    >
    > Is there some way to determine, before uploading, how many files have
    > been selected?


    Korpela is going to have a field day with this --- Maybe there is
    something that can be checked via Javascript?

    --
    Adrienne Boswell at Home
    Arbpen Web Site Design Services
    http://www.cavalcade-of-coding.info
    Please respond to the group so others can share
    Adrienne Boswell, Jun 17, 2010
    #1
    1. Advertising

  2. On 17 June, 01:07, Ed Jay <> wrote:
    > Adrienne Boswell wrote:
    > >Gazing into my crystal ball I observed Ed Jay <>
    > >writing innews::

    >
    > >> I'm using HTML5 Forms to select multiple files for uploading:

    >
    > >><form id='form2' name='form2' action="/cgi-bin/upload.pl\"
    > >>method='post'
    > >> enctype='multipart/form-data'>

    >
    > >><input type='file' name='myFile0' id='myFile0' value='' multiple
    > >>min='0'
    > >> max='99' files=''>

    >
    > >><input type=submit value='Upload Files'>

    >
    > >> Is there some way to determine, before uploading, how many files have
    > >> been selected?

    >
    > >Korpela is going to have a field day with this ---

    >
    > I expect that. :) (And, welcome it.)
    >
    > >Maybe there is
    > >something that can be checked via Javascript?  

    >
    > I'm hopeful, but nothing I've tried has worked. I've tried
    > document.forms["form1"].elements["myFile0"].value but it always comes up
    > empty.


    Your form is called "form2" not "form1"
    Captain Paralytic, Jun 17, 2010
    #2
    1. Advertising

  3. Ed Jay wrote:

    > Captain Paralytic wrote:

    [...]
    >>> I'm hopeful, but nothing I've tried has worked. I've tried
    >>> document.forms["form1"].elements["myFile0"].value but it always
    >>> comes up empty.

    >>
    >> Your form is called "form2" not "form1"

    >
    > Thanks. My typo error.


    First of all, apologies for commenting on this so late. When the thread was
    fresh, I was actually having a field day in Peak District. :)

    The code, with the correction, indeed works, for some values of "works".
    It's a bit outdated coding style, since these days we normally use a more
    direct approach:
    document.getElementById("myFile0").value

    However, what you get depends on the browser and its settings. This is one
    of the areas where security settings may have great impact, and they might
    prevent getting the file path, as it can be considered to be in the area of
    privacy of the computer or her user. For example, on IE 8 you would get
    something like
    C:\fakepath\foobar.zap
    where "fakepath" appears literally, i.e. the actual path has been masked
    out. On Firefox, you would get just
    foobar.zap
    i.e. the relative filename without hinting what it is relative to.

    Moreover, although file input was originally defined in HTML drafts and
    specifications as allowing multiple files per one <input type="file">,
    browsers generally ignored that and supported only one file per element.
    Typically, authors have solved this problem by providing multiple <input
    type="file"> elements, possibly generating them on the fly with client-side
    JavaScript (so that whenever a new file has been selected, a new file input
    dialog appears).

    The fancy HTML 5 stuff is in this matter, as usual, rather useless for the
    time being. Firefox supports multiple file input when the multiple attribute
    is used, as per the HTML 5 draft (so it graciously acts by published
    specifications if you throw in some attributes that are invalid according to
    published specifications), but IE doesn't. So you might get lured into
    thinking you have created multiple file input control when you actually
    provide just single file input to most users. Moreover, Firefox only returns
    the name of the first file when there are multiple files.

    Looking at the current HTML 5 draft, I notice the files attribute which is
    supposed to return a FileList object of selected files. So to get the names
    of the selected files you would use
    document.getElementById("myFile0").files.name)
    where i is an index to the list of files, starting from 0. If you only wish
    to get the number of files, you can use
    document.getElementById("myFile0").files.length

    Of course such an expression is unsafe, as the browser might not have
    implemented this part of the HTML 5 draft. You can use e.g.
    if(document.getElementById("myFile0").files) { ... } else { ... }
    so that the then part uses the information as above whereas the else part
    assumes that the number of files cannot be known (and is most probably
    either 1 or 0, though you can probably distinguish between 1 and 0 by
    checking whether document.getElementById("myFile0").value is defined or not.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, Jun 21, 2010
    #3
  4. Ed Jay wrote:

    > I'll be testing your suggested code and variations. Hopefully, Opera
    > has implemented that of which you expound.


    I'm afraid it hasn't - just tested on Opera 10.0, and it failed.

    Some past versions of Opera were about the only browsers that supported
    multiple file submission per one <input type="file"> element. For some odd
    reason, they removed that feature

    > I'm only concerned about Opera as the browser...we supply our clients
    > with a custom version of Opera 9.64, which has implemented multiple
    > file selection with one input element.


    Well, maybe... I thought they removed that feature earlier, but a custom
    version might still have it. Worse still, Opera 10.0 does not seem to let me
    even get the filename of the selected file ("security feature", I suppose).

    > We require that a minimum of
    > three images be uploaded to our site, and so far have had no luck with
    > validating the upload, until after the fact (how many were uploaded).


    I think you just need to be satisfied with the server-side check. After all,
    if a page clearly says at that at least three images be uploaded, it is fair
    to let the user know about the violation of this requirement "after the
    fact" only.

    --
    Yucca, http://www.cs.tut.fi/~jkorpela/
    Jukka K. Korpela, Jun 21, 2010
    #4
  5. Adrienne Boswell

    BootNic Guest

    On Mon, 21 Jun 2010 14:08:53 -0700
    Ed Jay <> wrote:

    [snip]
    >>> I'm only concerned about Opera as the browser...we supply our
    >>> clients with a custom version of Opera 9.64, which has
    >>> implemented multiple file selection with one input element.

    [snip]
    >>> We require that a minimum of three images be uploaded to our
    >>> site, and so far have had no luck with validating the upload,
    >>> until after the fact (how many were uploaded).


    If 3 is the minimum then perhaps setting min="3" rather then mim="0"
    will suffice, and perhaps setting the max to something realistic
    unless 99 files really is the maximum.

    If a JavaScript solution is desired, that may be possible providing the
    value can be parsed in order to count the files.

    I believe it has already been pointed out that files.length would be
    correct approach.

    This is not intended as a cross browser solution. It is intended for
    Opera 9.64, although it may just work on other Opera versions as well.
    I think this is a bug and should not work, but until it is fixed.

    if(window.opera) {
    var clone = document.getElementById('myFile0').cloneNode(true);
    clone.type = 'text';
    alert(clone.value);
    }

    Now with all that mess, I do wonder what method would be used to
    process the $_POST data that Opera sends.

    [snip]



    --
    BootNic Tue Jun 22, 2010 08:51 pm
    I had a monumental idea this morning, but I didn't like it.
    *Samuel Goldwyn*

    â• 20 days remaining

    -----BEGIN PGP SIGNATURE-----
    Version: GnuPG v2.0.12 (GNU/Linux)

    iEYEARECAAYFAkwhWqgACgkQmo2774GZ7qmEYQCgw9EpNXwcrwUhCqv9Y8rZHn9+
    RrYAnA/vZYy31f20sGuc2uMVvX9Ih//t
    =dILB
    -----END PGP SIGNATURE-----
    BootNic, Jun 23, 2010
    #5
    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. Robert Jones

    html5 vs xhtml2

    Robert Jones, Dec 2, 2007, in forum: HTML
    Replies:
    16
    Views:
    819
    Bergamot
    Dec 14, 2007
  2. n0ctis

    HTML5 vs. XHTML

    n0ctis, Aug 15, 2008, in forum: HTML
    Replies:
    4
    Views:
    1,277
    SpaceGirl
    Aug 18, 2008
  3. Ganesh

    HTML5

    Ganesh, Aug 30, 2009, in forum: HTML
    Replies:
    70
    Views:
    3,088
    Ganesh
    Sep 23, 2009
  4. Eric
    Replies:
    2
    Views:
    462
  5. thunk
    Replies:
    5
    Views:
    295
    thunk
    Dec 10, 2010
Loading...

Share This Page