Bazenga Posted October 21, 2009 Share Posted October 21, 2009 Hello, I need to click a button using Javascript. I searched the Internets and I found the following code: <script type="text/javascript"> function buttonClick() { if (document.getElementById('send').dispatchEvent) { var mine = document.createEvent("MouseEvents"); mine.initEvent("click", true, true); document.getElementById('send').dispatchEvent(mine); } else { document.getElementById('send').click(); } } </script> //body <body onload="buttonClick();" onunload="buttonClick();"> </body> At first, I was using: document.MyForm.Button.click(), it turned out that it only works with IE and throws an error in Firefox. The above code is still working with IE, but not in Firefox and it doesn't throw an error or anything like that. It's like it's not there at all. Any help is appreciated, thanks. Link to comment Share on other sites More sharing options...
0 Dick Montage Posted October 21, 2009 Share Posted October 21, 2009 Do not put the code you want in the button click event, put it into a function. Then call that function from the click - and you can call the function from whenever else you want too. Or is there a situation that this would not allow? Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 21, 2009 Author Share Posted October 21, 2009 I'm not sure if I understood you correctly. The problem is that the button must be clicked programmatically. I have a form that I need to submit at runtime, and it requires that "button click". I'm trying to simulate a user clicking that button. Could you give me an example please? Link to comment Share on other sites More sharing options...
0 Dick Montage Posted October 21, 2009 Share Posted October 21, 2009 <input type="button" onclick="alert('click')" /> Would become function doClick(){ alert('click'); } <input type="button" onclick="doClick()" /> Or even... If you want the sender to be available... function doClick(sender){ alert(sender); } function simulateClick(objectId){ objMyButton = document.getElementById(objectId); doClick(objMyButton); } <body onload="simulateClick('myButton')"> <input id="myButton" type="button" onclick="doClick(this)" /> Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 21, 2009 Author Share Posted October 21, 2009 Thanks for your input, but that's not the problem I'm facing. The main issue is doing the click itself on the button, and not "onclick" or whatever. onclick implies that the button was clicked. I need to do the clicking before, right? <body onload="simulateClick('myButton')"> That's not a click simulation, you're just calling alert(). I need a something like alert() that actually clicks the buttom (submitting the form). Link to comment Share on other sites More sharing options...
0 Dick Montage Posted October 21, 2009 Share Posted October 21, 2009 Yes and what I am saying is this: Why do you need the physical button to be clicked? Surely when clicked you want "something" to happen? Fine... But shift this "something" out, and call it when the button is clicked. You can then call it at another time also - simulating the same action as the button being clicked... OR Look into using jQuery? I believe this may help: http://stackoverflow.com/questions/343811/...ry-click-method Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 21, 2009 Author Share Posted October 21, 2009 I really appreciate your help, really. However :p, all I want is to click the button, nothing more. There is no logic, there are no routines ... nothing. It's just a matter of click that damned button ! <form id="MyForm" name="MyForm" method="post" action="https://linkgoeshere" enctype="multipart/form-data"> <input field><input field><input field> <input type="submit" value="login" name="send" id="send" /> </form> That's the form I have, and that's the button that must be clicked without the user actually clicking it. Do you have *any* idea why Firefox does not allow this: document.MyForm.send.click() ? It's so simple, it works on IE but not on firefox ;(. Link to comment Share on other sites More sharing options...
0 Devion Posted October 21, 2009 Share Posted October 21, 2009 Is it just a form you want to submit? document.formName.submit() will do that for you. Or am I also misunderstanding? Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 21, 2009 Author Share Posted October 21, 2009 I'm not sure why, but if I do form.submit() the user will be redirected to the actual form, with the fileds all filled up with the information, but he still have to click login. The application I have at hand tried to hide all this overhead from the user. So he goes to our application, clicks a link (for example, to a specific provider), and continues without him logging in to every single provider. For that reason, we submit that form (and all other forms) at runtime. There are some forms that works perfecty with the submit() function, and there are forms that oblige you to click the button. That's why I need to know how to click that button, or actually simulate the click as if the user actually clicked it. Does that make any logical sense to anyone? Link to comment Share on other sites More sharing options...
0 Dick Montage Posted October 21, 2009 Share Posted October 21, 2009 OK, am outta ideas. Possibly talk us through the entire scenario? Link to comment Share on other sites More sharing options...
0 PurePhoenix Posted October 21, 2009 Share Posted October 21, 2009 tried greasemonkey? it's an addon for firefox that has support for all events. That's about as much as i know of it though. Link to comment Share on other sites More sharing options...
0 Dick Montage Posted October 21, 2009 Share Posted October 21, 2009 You can't design a site around a firefox addon of such type. Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 21, 2009 Author Share Posted October 21, 2009 Okay, lets take a form that submits a search term to Google. <body onload="gForm.submit();"> <form name="gForm" method="get" action="http://www.google.com/search?hl=en&source=hp&aq=f&oq=&aqi="> <input type="hidden" name="q" value="test" /> </form> </body> That works perfectly fine, when you visit that page, you'll get redirected to Google with "test" as your search term. I have almost the same forms, the information are coming from the database (username, password .. etc ..). As you can see, the form works fine with the submit() function. That's not the case when you have HTTPS. I know that the form above works with the submit, but lets do it with a button, shall we? <body> <form name="gForm" method="get" action="http://www.google.com/search?hl=en&source=hp&aq=f&oq=&aqi="> <input type="hidden" name="q" value="test" /> <input type="submit" value="submit" name="send" id="send" /> </form> </body> How do I submit that form by clicking the button with Javascript? If we did this: <body[u][b] onload="gForm.send.click();"[/b][/u]> <form name="gForm" method="get" action="http://www.google.com/search?hl=en&source=hp&aq=f&oq=&aqi="> <input type="hidden" name="q" value="test" /> <input type="submit" value="submit" name="send" id="send" /> </form> </body> It WILL work, but only in IE. Firefox throws an error. I need to find a way to do it for both IE and Firefox. Link to comment Share on other sites More sharing options...
0 Bazenga Posted October 22, 2009 Author Share Posted October 22, 2009 *bump* anyone? Link to comment Share on other sites More sharing options...
0 Antaris Veteran Posted October 22, 2009 Veteran Share Posted October 22, 2009 I'd recommend using JQuery, as it adds a nice transparency layer over the browser, so the same function call in JQuery will operate fine on both IE, Firefox, etc. Once you have referenced the JQuery library, do something like this: $(function() { $("input.send").click(); }); Or, to just submit the form: $(function() { $("form").submit(); }); The problem you will be seeing is that the click and submit actions are very different. A click event in javascript does not action a form, it literally is for clicking on the physical button. A submit event will actually do the form post. Link to comment Share on other sites More sharing options...
0 em_te Posted October 22, 2009 Share Posted October 22, 2009 Try loading Firefox in Safe Mode. Link to comment Share on other sites More sharing options...
Question
Bazenga
Hello,
I need to click a button using Javascript. I searched the Internets and I found the following code:
<script type="text/javascript"> function buttonClick() { if (document.getElementById('send').dispatchEvent) { var mine = document.createEvent("MouseEvents"); mine.initEvent("click", true, true); document.getElementById('send').dispatchEvent(mine); } else { document.getElementById('send').click(); } } </script> //body <body onload="buttonClick();" onunload="buttonClick();"> </body>At first, I was using: document.MyForm.Button.click(), it turned out that it only works with IE and throws an error in Firefox.
The above code is still working with IE, but not in Firefox and it doesn't throw an error or anything like that. It's like it's not there at all.
Any help is appreciated, thanks.
Link to comment
Share on other sites
15 answers to this question
Recommended Posts