• 0

[Javascript] How to simulate a click on Firefox?


Question

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

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

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

<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

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

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

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

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

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

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.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Exactly, the E-cores actually give you good performance for what they offer, it's no surprise that Intel is doubling down on more E-cores instead of more P-cores. The LP-cores are good for when you're system is just sitting there idle and waiting to be used. Every core has it's place tbh, it's just up to Intel to and MS to work to get the scheduler right.
    • Report: Trump's T1 Mobile off to a rocky start with messy pre-orders by David Uzondu You might have heard by now that The Trump Organization, spearheaded by President Trump's sons, Donald Trump Jr. and Eric Trump, is launching yet another product to add to the collection. This time, it is a gold smartphone, the T1, and a companion wireless service. The whole operation is being pushed with the usual "America-first" bravado, but it seems they forgot to get the basics right. If you thought you could just hop online and secure your patriotic pocket computer, you are in for a nasty surprise, as the whole process appears to be fundamentally broken. A new report from 404Media details this chaos perfectly, as one of their writers tried to order one of the T1 phones. The goal was simple: pay the $100 preorder deposit and see what this thing is all about when it ships. What happened next was a masterclass in how not to conduct e-commerce. The website crashed, booted him to an error page, and then, for good measure, charged his credit card the wrong amount entirely, taking $64.70. And get this, he received a confirmation email saying his order would ship... despite never once being asked for his shipping address. It is, in his words, the "worst experience I've ever faced buying a consumer electronic product". To add insult to injury, when he tried to log into the new account, the site prompted him to create, and he was immediately met with yet another error page, locking him out. The shoddy experience is not just limited to the checkout. Neowin found a bunch of errors on the official product page. Sure, it boasts a big 6.8-inch Punch Hole AMOLED display with a 120Hz refresh rate and a 50MP main camera, which sounds nice on paper. But then you notice the company completely forgot to mention what processor powers the phone, which is probably a MediaTek. At one point, the page bizarrely listed a "5,000 mAh long life camera," though that has since been fixed. By the way, there's good reason to doubt that this phone will be made in America, despite the press releases insisting it will be. Sourcing all the necessary components without using foreign parts is unbelievably difficult and expensive, something even Apple does not do. The more likely scenario, according to Max Weinbach, is that this is simply a reskin of a much cheaper device, maybe the T-Mobile REVVL 7 Pro 5G, which retails at a fraction of the T1's $499 asking price. The T1 Mobile joins a sprawling collection of other products likely aimed at the same loyal customer. The catalog of gear for this audience already includes the gold "Never Surrender" sneakers, the "God Bless the USA" Bible, "Victory47" perfume, digital trading cards, $TRUMP memecoins, and more. It is still very early days, of course, and while one might forgive some teething issues for a new venture, this initial preorder phase has been exceptionally chaotic. Hopefully, things will become much clearer once there is a firm launch date and a physical product to test. Do you plan to buy the T1 and move to Trump Mobile?
    • Is this release set for the end of this year or for next year?
  • Recent Achievements

    • Week One Done
      korostelev earned a badge
      Week One Done
    • Week One Done
      rozermack875 earned a badge
      Week One Done
    • Week One Done
      oneworldtechnologies earned a badge
      Week One Done
    • Veteran
      matthiew went up a rank
      Veteran
    • Enthusiast
      Motoman26 went up a rank
      Enthusiast
  • Popular Contributors

    1. 1
      +primortal
      675
    2. 2
      ATLien_0
      264
    3. 3
      Michael Scrip
      184
    4. 4
      +FloatingFatMan
      177
    5. 5
      Steven P.
      140
  • Tell a friend

    Love Neowin? Tell a friend!