• 0

[Javascript] How to simulate a click on Firefox?

Asked by Bazenga,

 Share

Question

Experienced

Bazenga

Posted
Posted

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.

15 answers to this question

Recommended Posts

  • 0
Grand Master

+Nik Louch Subscriber²

Posted
  • Subscriber²
Posted

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?

  • 0
Experienced

Bazenga

Posted
  • Author
Posted

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?

  • 0
Grand Master

+Nik Louch Subscriber²

Posted
  • Subscriber²
Posted 

<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)" />

  • 0
Experienced

Bazenga

Posted
  • Author
Posted

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

  • 0
Grand Master

+Nik Louch Subscriber²

Posted
  • Subscriber²
Posted

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

  • 0
Experienced

Bazenga

Posted
  • Author
Posted

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

  • 0
Experienced

Bazenga

Posted
  • Author
Posted

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?

  • 0
Experienced

Bazenga

Posted
  • Author
Posted

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.

  • 0
Grand Master

Antaris Veteran

Posted
  • Veteran
Posted

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.

This topic is now closed to further replies.
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.

  • Posts

    • Microsoft releases major feature updates for stock Windows 11 apps

      By Neeo · Posted

      When will the Photos app be updated to remember the window size and position when reopened? They addressed this issue in a 2024 version of the app (though I can't recall the build number). Unfortunately, after that specific version, the problem persists! Please prioritise this fix in your K2 schedule. Additionally, the Snipping Tool has lost the ability to capture the Windows Taskbar starting from the 2024 version!
    • EU Commission explains why Siri AI isn't launching in the EU, and Apple is to blame

      By Dutchie64 · Posted

      Oh dear... my sweet summer child......
    • Spotify finally removes the disco ball app icon in the latest update

      By Xerxes · Posted

      Same, never saw it on Android or iOS. Guess only some people got it *shrugs*
    • Anthropic pulls Fable 5 and Mythos 5 after US export control order

      By pradeepviswav · Posted

      Anthropic pulls Fable 5 and Mythos 5 after US export control order by Pradeep Viswanathan In April this year, Anthropic launched the Claude Mythos Preview frontier model with state-of-the-art cyber and coding capabilities for a select set of companies around the world. After preparing appropriate guardrails, early this week, Anthropic launched Claude Fable 5 and Mythos 5, its most capable AI models. Claude Fable 5 is for general users and comes with strict safeguards, while Mythos 5 is designed with fewer safeguards for cybersecurity and biology use cases. Today, Anthropic abruptly suspended access to its Fable 5 and Mythos 5 AI models for all customers after receiving an export control directive from the US government. The company received the directive from the government today at 5:21 p.m. ET, and the received letter did not provide any details regarding the national security concern. Anthropic understands that the government became aware of a method to bypass, or “jailbreak,” Fable 5, which might be the reason behind the directive. The order was issued under national security authorities and requires the company to suspend all access to Fable 5 and Mythos 5 by any foreign national, whether they are inside or outside the United States. The restriction also applies to foreign national employees working at Anthropic. As a result, the company has disabled both models for all customers to ensure compliance. Access to previous Anthropic models like Opus and Sonnet is not affected by this government order. The company highlighted that it had developed strong safeguards to reduce the possibility that Fable is misused for tasks related to cybersecurity. In fact, many developers are complaining that the safeguards are going overboard. Additionally, the company worked with the US government, the UK AISI, multiple private third-party organizations, and internal teams to red-team Fable’s safeguards for thousands of hours. Finally, Anthropic noted that no testers have yet been able to find a universal jailbreak on Fable 5. As expected, Anthropic disagrees that a narrow potential jailbreak should lead to the recall of a commercial model used by hundreds of millions of people. It warned that applying this standard across the AI industry could effectively halt new frontier model deployments. Anthropic concluded by mentioning that it is working to restore access to Fable 5 and Mythos 5 as soon as possible and plans to share more details within the next 24 hours.
    • Brave Browser 1.91.172

      By Copernic · Posted

      Brave Browser 1.91.172 is out.

  • Recent Achievements

    • Week One Done
      ssd21345 earned a badge
      Week One Done
    • Contributor
      MarkHughes4096 went up a rank
      Contributor
    • Dedicated
      jordanspringer earned a badge
      Dedicated
    • Rookie
      Rimplesnort went up a rank
      Rookie
    • One Year In
      Markus94287 earned a badge
      One Year In

  • Popular Contributors

    1. 1
      +primortal
      503
    2. 2
      +Edouard
      176
    3. 3
      PsYcHoKiLLa
      147
    4. 4
      ATLien_0
      92
    5. 5
      Steven P.
      79
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!