LogikDevelopment » Return key http://www.logikdev.com "Il n'y a pas de problème, il n'y a que des solutions. L'esprit de l'homme invente ensuite le problème." André Gide Tue, 20 Dec 2011 12:25:13 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Onclick event is not fired on IE http://www.logikdev.com/2009/12/08/onclick-event-is-not-fired-on-ie/?utm_source=rss&utm_medium=rss&utm_campaign=onclick-event-is-not-fired-on-ie http://www.logikdev.com/2009/12/08/onclick-event-is-not-fired-on-ie/#comments Tue, 08 Dec 2009 23:05:58 +0000 smoreau http://www.logikdev.com/?p=175 I am pretty sure everybody knows that Internet Explorer has “a few” bugs… :roll:
You didn’t? 8-O Alright, better to stay on your little cloud and leave this blog right away!

For the others, I will talk about the JavaScript event onclick which is not fired when the following requirements are matched:

  • In a form;
  • There is only ONE input text element;
  • There is one button which has an onclick event assigned;
  • You press the ‘Enter’ button inside the input text element.

For a better understanding, let’s now take the following example:

<html>
    <head><title>Test</title><head>
    <body>
        <form>
            <input type="text" id="t1"/>
            <input type="submit" onclick="alert('onclick fired!'); return true;"/>
        </form>
    </body>
</html>

As you can see, there is nothing difficult in this code.
Well, that doesn’t mean Internet Explorer can handle it… :lol:

The bug occurs if you press the ‘Enter’ button inside the input text element using Internet Explorer. Indeed, the onclick event is not fired and the text ‘onclick fired!’ is not display to the user! However, it works perfectly fine on Firefox and Safari.

The funny thing is this code works on Internet Explorer if you add another input text, even if it is hidden!
Why? Don’t ask me! :-|

Anyway, the following example works on IE:

<html>
    <head><title>Test</title><head>
    <body>
        <form>
            <input type="text" id="t1"/>
            <input type="text" style="display:none"/>
            <input type="submit" onclick="alert('onclick fired!'); return true;"/>
        </form>
    </body>
</html>


Why are we assigning an onclick event to the submit button?
It could be for a lot of reasons, but the main one is probably to validate the form before submitting the data.

By the way, RichFaces is very often using this event on the submit buttons.
So remember to add a hidden input text to your form if you want to allow users to use the ‘Return’ key. :)

]]> http://www.logikdev.com/2009/12/08/onclick-event-is-not-fired-on-ie/feed/ 0