Need a simple CRM and Project Management system?
Check out JobNimbus - CRM for Contractors and Service Professionals.

Fix for Firefox click() event issue

Firefox does not support the javascript click() event on a hyperlink. So doing something like:

<asp:LinkButton ID="lnkMyButton" runat="server">My Button To Click</asp:LinkButton>
 
<a href="#" onclick="document.getElementById('lnkMyButton').click();">Click this to click the other link!</a>

This will work correctly in Internet Explorer but nothing will happen when you execute this javascript in FireFox.



This is because the javascript line in Firefox has the click() event and Firefox does not understand this event for hyperlinks (which is what an ASP.NET LinkButton control is rendered as on page load):

document.getElementById('lnkMyButton').click();

Workaround 1:

Instead of using a LinkButton control, use a Button control instead. Firefox does support the click() event for input type=button HTML controls. So you could change the code to this:

<asp:Button ID="btnMyButton" runat="server" />
 
<a href="#" onclick="document.getElementById('btnMyButton').click();">Click this to click the other button!</a>

Workaround 2:

If you can’t change the element to a Button control instead of a LinkButton, you can simulate the postback event by calling the method that .NET calls in the background when you click on the LinkButton control directly. This event is called __doPostBack() and takes the ID name of the control that you want to cause a postback. So you could change the code to this:

<asp:LinkButton ID="lnkMyButton" runat="server">My Button To Click</asp:LinkButton>
 
<a href="#" onclick="__doPostBack('lnkMyButton', '');">Click this to click the other link!</a>

The nice thing about this one is that even if this is in an ASP.NET AJAX UpdatePanel, it will still do the asynchronous postbacks correctly and post the link button.

Workaround 2

For ASP.NET: __doPostBack use value of UniqueID property as argument on client side, not ClientID.

So use Control.UniqueID property if you want to create JavaScript postback string manualy in page code file.

For example:

TextBox1.Attributes.Add("onkeypress", "if(event.keyCode==13){__doPostBack('" + LinkButton1.UniqueID + "', '');");

Issues solved

Thanks for your post, it solved one of the major problem I faced.

facing problem in h:inputText JSF element

i have followig below code and click() does not activate h:inputText element.

JSF code
==================

JAVA Script
======================
var operationDateSupport = document.getElementById("mainForm:body:timeValidate");

operationDateSupport.click();

I would be thankful if any of u will be helpful to me in this poblem.

Wow, so easy...

Brilliant! Thank you!!

THANKS!!!!

This problem was driving me nuts! And yes this was for asp.net ajax async postbacks on a link - as suggested in the last comment.

Many thanks in sharing the resolution :)

THANKS!!!

Whoever put up the eval code, I want to personally thank you....I have been trying to fix this nagging problem for days now. YOU ARE A LIFESAVER!!!!

callclick in ie,firefox,chrome(Fire fox link button click event)

function CallClick()
{
//document.getElementById('LinkButton1').click(); //ONLY WORK IN IE
//WORK IN ALL BROWSER
window.location.href = document.getElementById('LinkButton1').href ;
return false;
}

LIFESAVER!

THANKS! Such a simple solution, works perfectly. The original post did not work for me but this comment is perfect solution

Perfect - thank you!

Perfect - thank you!

excellent

this is an excellent solution, i have been looking for this for a while and did my work. thumbs up

For other links

for other links which have javasscript defined in href, if you need to do it then you can use:

eval(lnk.href.replace('javascript:', ''));

YES!!!!!!!!!!!!!!!1

IS'T WORK!!!!! TANKS ALL

Still Query

Hi,

I am using plain javascript. What if there is input file box ? Can we simulate input file control click event through javascript ? I have tried with following code its not working in FF 3.5.

Click Me!


Please let me know if you have any idea about it or any directions how to fix it

- Parag

Trigger Firefox .click()

Thats that fixed it perfectly

asp:Button instead of a asp:LinkButton, very simple

PERFECT!!!

This is the solution!!! thx a lot guy!

Tanks

Thank you very much, i was searching for a workaround for a while now..

thanks and greetings from germany,

michael

EASY FIX WHEN LINKBUTTON IS USED

I have found another easy way to fix this problem when Linkbutton is used.

Check out this for solution http://dotnetguts.blogspot.com/2009/05/click-event-problem-firefox-solut...

EASY FIX WHEN LINKBUTTON IS USED

This works! Wow. Thanks

Armstrong

You saved my Life!!!
thanks

Thank you very much! After searching

Thank you very much! After searching and reading a lot of pages (with no luck), this is just what I was looking for... :)

THANKS A LOT, I've been searching

THANKS A LOT, I've been searching solutions allover, but didn't think my problem was caused by Link button! Thanks especially for second workaround! ;)

Saw this in a forum:

Should cover any and all contingencies:

if(typeof HTMLElement!='undefined'&&!HTMLElement.prototype.click) {
HTMLElement.prototype.click=function() {
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}
}

Not a fix, only a lousy workaround

Sorry Anonymous above me, but the code you posted does nothing. All it does is bind all of a page's controls to a "ghost" .click() event, to make firefox stop complaining about ".click() is not a function" (if u wanna see this, bring up the error console while clicking on the link). It never processes your event handler, because it is being redirected to some "lost in space and time" dummy mocked-up event handler (not yours).
Still, nothing will happen when u click it. I know that, because I've tried it before reaching Ben's solution. I was about to give up at 6:25pm this evening, after struggling with it a whole day.

Thanks a lot Ben, for this REAL solution you provided (especially, the second workaround) - it was staring me in the face the entire time, and I didn't think of scripting it that way. Doh...

Wroks fine without the if

HTMLElement.prototype.click=function() {
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}

onClick= ActionClick(| + Cstr(intCount+1) + |,this) not working

I have a button from that i call the above function .This is in some script so i can't create a new function other than this..when i click on button it shows "Form Processed"...but it should validate and submit the form.It validates properly but after pop up it goes to form processing..If i use mouseover on place of onClick it works fine.