Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Simulate click on "Browse" button

    I am trying to simulate a click on the browse button of a file upload field (input type="file").

    After a long search, i've found the createElement function, which, if i understand correctly, is the "official" cross-browser solution.

    This is the code i've written
    Code:
    function BrowseClick()
    {
    	var ClickBrowseButton = document.createEvent("MouseEvents");
    	ClickBrowseButton.initEvent("click", false, false);
    	
    	document.nzb_file_form.nzb_file.dispatchEvent(ClickBrowseButton);
    }
    As far as my understanding goes, this code is correct. It does not give me javascript errors. However, nothing happens. I also tried to use getElementById, but the result was the same.

    Does anyone have any idea how to get this working?

    Thanks.

  • #2
    Regular Coder
    Join Date
    Aug 2004
    Location
    codegoboom@yahoo.com
    Posts
    999
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by martijntje
    After a long search, i've found the createElement function, which, if i understand correctly, is the "official" cross-browser solution.
    Did you mean createEvent?

    Since IE6 implements <= DOM level 1, it wouldn't be cross-browser in that respect. Besides, if the click() method doesn't work, then workarounds would probably be blocked as well...
    *this message will self destruct in n-seconds*

  • #3
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yup, i meant createEvent, as shown in my code example.
    And it is in no way meant to run in Interweb Exploder, since IE doesn't even appear to support javascript, not even at the lowest security setting...

    Besides, the site is a php-client to the nzbqueue daemon, which only runs on unix, so i don't think many people will want to run the page in IE

    Edit: i just found out that createEvent does not simulate clicking, but only calls the onclick function of the given element, and that does work...

    So i probably had too high an expectation of the createEvent function. Isn't there a function that simulates a mousebutton click?

  • #4
    Regular Coder
    Join Date
    Aug 2004
    Location
    codegoboom@yahoo.com
    Posts
    999
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There might be a method (mentioned somewhere around here)...
    *this message will self destruct in n-seconds*

  • #5
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There is only an IE solution posted, but that is of no use to me.

  • #6
    Regular Coder
    Join Date
    Aug 2004
    Location
    codegoboom@yahoo.com
    Posts
    999
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The method may very well be disabled for input/file, however it is supported by browsers other than IE.
    *this message will self destruct in n-seconds*

  • #7
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK, i think i'll just have to accept that this is not going to work, and try an alternate route.

    My backup plan is to position the "Browse" button exactly under the "fake button" so that the click bubbles through. However, the problem is that i can't even set the width of the darn thing, and every browser has a different size box

    Is there then perhaps a way to make sure the box is at least positioned correct?

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    near Oswestry
    Posts
    4,508
    Thanks
    0
    Thanked 0 Times in 0 Posts
    There's very little you can do about this - you certainly can't send events to the button or replace it with something else. With any other kind of form element it wouldn't be a problem (and btw, "dispatchEvent" is what you originally wanted) but file inputs have very strict security restrictions, to stop them from being misused.

    But a combination of the "size" attribute (which for some reason is the only thing FF listens to) and a CSS width property (which equates to the overall width, including the button) should be enough to at least make it the right size for its space.
    "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

  • #9
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yeah, i already noticed the size part, i've set it to 1, since 0 resets it to default.

    However, the CSS width property doesn't work for me. If i set the width, all it does is move the object to the right, instead of making it smaller, like i want to.

  • #10
    New Coder
    Join Date
    Mar 2005
    Posts
    33
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Almost there!

    OK, i'm almost there! I had the idea to wrap the button up inside something i could style, so i could at least set the dimensions, and then put something over it.

    As it turns out, the only thing strong enough to control a input/file is a(n) (i)frame. So i copied the form into another page, and created an iframe. I can now even use the -moz-border-radius to make round corners!

    All nice and well, but i wouldn't write this if all was complete well. The iframe containing the input/file is supposed to target yet another iframe, however it loads in the main page. I have tried target="parent.upload_frame" but this does not work. When the form was in the main page, it used to work with target="upload_frame"

    Another thing i have trouble with is getting the button in the right place. For some reason the button seems to dislike all the other buttons and keeps it's distance. Anyone have any idea how to stop it? I rather not use absolute positions for this, but i will if it's the only choice.

    Thanks in advance, and sorry for the long post.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •