• 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

    • Windows 10 KB5063159 fixes bug that wouldn't let some Microsoft Surface devices boot

      By alphabet-jigsaw · Posted

      Oops!
    • Microsoft locks Windows 11 user out, shows how easy losing data from forced encryption is

      By hellowalkman · Posted

      Microsoft locks Windows 11 user out, shows how easy losing data from forced encryption is by Sayan Sen Back in March earlier this year, a new redesigned Microsoft Account sign-in was released with the intention to make it "more modern, simple, and secure." Microsoft also probably hopes that the revamp will help win some hearts since many dislike the Microsoft Account (MSA) quite a bit as they are forced to use the service during Windows 11 installation. Yes, signing in to the MSA is one of the several system requirements for Windows 11, and it is also the recommended way and it clearly does not like it when users opt for a Local account instead. Microsoft often highlights the benefits of an MSA as it points out the unified access users get across devices and services like Windows, Office, OneDrive, and Xbox, which can help in synchronization of files and settings for convenience. A Microsoft Account also stores the BitLocker encryption key which is crucial thing that all users who have encryption need to store securely. Back in May this year, we covered reports of users losing their data as a consequence of BitLocker key loss, and this is a real danger for many, given that Microsoft now enables automatic BitLocker encryption on Windows 11 24H2, that most users won't even be aware of. So in the case of loss of access to a Microsoft Account, an affected user can suddenly find that they have lost all their data and there may be no way to recover it according to Microsoft's terms. Such account lock-outs can happen as a Reddit user deus03690 found out. The frustrated user claims that Microsoft apparently "randomly" locked their account when they were dealing with multiple data drives. They explain: The user has good reason to be annoyed and frustrated at this, Microsoft's own official guidance about the Account lock says: "If you tried to sign in to your account and received a message that it's been locked, it's because activity associated with your account might violate our Terms of Use." The Terms of Use for MSA explain how Microsoft deals with a closed account. It states: Thus, this shows how users can be pretty much helpless if they get locked out of MSA or lose access to it. It also shows how over-reliance on cloud services on Windows 11, something which LibreOffice recently pointed out, can lead to additional data nightmares like losing all of your data due to forced BitLocker encryption that you may not even be aware of was there in the first place. The solution? Better keep your important data backed up locally on internal or external HDDs and SSDs as only cloud storage is probably not the best decision.
    • Politically funny images of the World

      By Michael Scrip · Posted

    • Intel's next-gen desktop processors leak with a whopping number of cores

      By dismuter · Posted

      I don't know, I haven't checked what changed in previous sockets. I agree that the 1156-1155-1151 succession was suspicious, with a reduction in pin count every time. Intel could do a better job of pre-allocating pins for future use. Another hypothesis is that the internal layout of their CPUs change, like the I/O is moved from one place to another on the chip, and they need to reorganize pins rather than having circuitry go into spaghetti mode to remain compatible. I agree that if AMD is able to maintain compatibility, Intel should be able to do the same, at least by reserving pins for future use and then using those pins when a need for them arises. However, I wouldn't say that AMD's products are entirely better. Intel's I/O now slightly edges out thanks to having double the bandwidth to the chipset and dedicated Thunderbolt lanes to the CPU. It seems that they could widen their lead with the next platform. NVMe SSDs have increased the need for PCIe lanes significantly, and AM5 has been pretty underwhelming in that regard, especially because the chipset connection is so narrow and gets saturated with just 1 gen 4 SSD, leaving the other chipset connectivity (Ethernet, Wi-Fi, audio, etc) to hope for any remaining bandwidth. Otherwise motherboard manufacturers could also make more x2 M.2 slots, those would be fast enough at gen 5 speeds and possibly at gen 4 speeds too.
    • Report: Trump's T1 Mobile off to a rocky start with messy pre-orders

      By Karlston · Posted

      Should've named it the T-Rump.

  • 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
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!