#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Location
    Sheffield
    Posts
    30
    Rep Power
    0

    input type=file - hiding the text box


    I'm currently writing a page which makes use of the <input type="file" /> object, and i am wanting to make the text box part hidden. is this possible? i haven't been able to find a way to reference the text box, only the entire input object (which includes the browse button).

    The only other idea i've had (which didn't work!) was to hide the entire thing, and launch the file browser from other button with the fireEvent method but i don't know what method to call.

    Anybody got any ideas?
  2. #2
  3. Moderator Emeritus
    Devshed Supreme Being (6500+ posts)

    Join Date
    Feb 2002
    Location
    Austin, TX
    Posts
    7,188
    Rep Power
    2265
    Its not possible, as far as I know.
    DrGroove, Devshed Moderator | New to Devshed? Read the User Guide | Connect with me on LinkedIn
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2003
    Location
    Sheffield
    Posts
    30
    Rep Power
    0
    I found the answer for anyone who was interested:

    <input id="selectedFile" type="file" onpropertychange="add()" style="position:absolute;visibility:hidden;"/>
    <input type="button" id="browseButton" value="Browse..." onclick="selectedFile.click()">
  6. #4
  7. NINJA! ...on fire no less
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2003
    Location
    Rockies
    Posts
    187
    Rep Power
    12
    this is beautiful playerone, exactly what I was looking for. ThanX.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2003
    Location
    Honolulu, Hawaii
    Posts
    60
    Rep Power
    12

    hide browse input box


    Originally Posted by playerone
    I found the answer for anyone who was interested:

    <input id="selectedFile" type="file" onpropertychange="add()" style="position:absolute;visibility:hidden;"/>
    <input type="button" id="browseButton" value="Browse..." onclick="selectedFile.click()">
    This doesn't work by itself in IE 5.5. Is that the whole thing? Or is it just for Mozilla?

    I get error message about onpropertychange="add()
  10. #6
  11. No Profile Picture
    The Forest
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2002
    Posts
    321
    Rep Power
    13
    You must have defined add() as a function. As this is written, it should work only in IE 5+. Try this:

    Code:
    <input type="file" id="selectedFile" style="display: none;" />
    <input type="button" value="Browse..." onclick="document.getElementById('selectedFile').click();" />
    That should work in Mozilla and IE.

    Hope that helps!

    Happy coding!

IMN logo majestic logo threadwatch logo seochat tools logo