click event not trigerred in IE

Question

I am trying to trigger a click event for a button from jquery. it works very well in FF but IE(all versions) seem to ignore it. this is what i have tried so far..

$('#uxcSubmit').trigger('click');

then tried this..

$('#uxcSubmit').click();

just to clear out..even this..

jquery('#uxcSubmit').click();

then even tried this to check if it is a problem of jquery..

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

nothing seems to help IE..

thanks in advance..

Update: this is the code.. and no i don't have elements of the same id..

<div id="uxcSavingDiv">Click sumbit to save changes...</div>
<input id="uxcSubmit" value="Submit" onclick="return SaveChange();"/>
<script type="text/javascript">
function getFrameValue() {
    if (Stage == 0) {
            $('#uxsHiddenField').attr("value", "saved");
            Stage = 1;
            $('#uxSubmit').click();
            return false;
    }
    else {
        $('#uxcSavingDiv').innerHTML = "Saving...";
        return true;
    }
}
</script>

i think i have been clear here

Seems like you have more elements with the same ID - don't you? — yedpodtrzitko, Mar 23 '10 at 08:21
You should post the whole block of code in which you are trying this, and what you are trying to do (i.e. if you are trying to trigger a custom event that was attached before or if you are expecting some browser behavior, like submitting a form). If you want to submit a form, it's better to use $("#formID").submit(). If you are trying to trigger an attached event, make sure you are not calling .click() in the same function that is attaching that event, it's possible that IE attaches it only after the current function returns. — Felix, Mar 23 '10 at 08:21
see http://stackoverflow.com/questions/980709/javascript-invoking-click-event-of-an-anchor-tag-from-javascript — knittl, Mar 23 '10 at 08:51
@knittl: i have tried all answers in that post.. please do see my question carefully... — ZX12R, Mar 23 '10 at 08:56
What does SaveChange() do? Have you tried `$("#uxSubmit").parents("form").submit()` ? — Felix, Mar 23 '10 at 09:26
@Felix: i don't want to submit my form directly... I want to display something before submitting... — ZX12R, Mar 23 '10 at 10:03
Using `.click()` won't achieve that. If you want to display a "Saving..." message you can do it in the `.submit()` handler. What I'm trying to say is that `.click()` and `.submit()` are equivalent (in this case), with the exception that `.submit()` has more chances of working in IE. — Felix, Mar 23 '10 at 10:07
I would change to take the behavior onclick="return SaveChange(); out of the markup and put it in the script where it belongs...put this in the script instead: $('#uxcSubmit').click(function(){ /*do you display here*/}); — Mark Schultheiss, Mar 23 '10 at 11:41

score 1 · Accepted Answer · answered Mar 23 '10 at 11:33

In the code you posted Stage is undefined, IE won't like this. Also $('#uxSubmit').click(); should be $('#uxcSubmit').click();. I also wasn't sure when you were calling getFrameValue(); but it must be done at or after document.ready or the elements won't be there to match selectors on.

I cleaned up the rest to use jQuery methods as well (leaving the in-line for demo, but I'd remove this as well and change it to a click handler), this works fine in IE8:

<div id="uxcSavingDiv">Click sumbit to save changes...</div>
<input id="uxcSubmit" value="submit" onclick="return SaveChange();"/>
<script type="text/javascript">
var Stage = 0;
function getFrameValue() {
    if (Stage == 0) {
            $('#uxsHiddenField').val("saved");
            Stage = 1;
            $('#uxcSubmit').click();
            return false;
    }
    else {
        $('#uxcSavingDiv').html("Saving...");
        return true;
    }
}
function SaveChange() {
  alert("Value clicked");
}
$(function(){
  getFrameValue(); //Trigger it on document.ready
});
</script>

To change that SaveChange() to a bound click handler, remove the onclick and do this on ready:

$('#uxcSubmit').click(SaveChange);

looks like you have it covered to me – Mark Schultheiss Mar 23 '10 at 11:37 — Mark Schultheiss, Mar 23 '10 at 11:37

score 0 · Answer 2 · answered Mar 23 '10 at 08:50

0

$("#uxcSubmit").closest("form").submit('SaveChange'); //let SaveChange() return true/false

... and remove inline 'onclick' attribute

answered Mar 23 '10 at 08:50

yedpodtrzitko

9,035
2
40
42

score 0 · Answer 3 · answered Mar 23 '10 at 09:04

The relevant code piece from jQuery should be this one

// Trigger an inline bound script
try {
    if ( !(elem && elem.nodeName && jQuery.noData[elem.nodeName.toLowerCase()]) ) {
        if ( elem[ "on" + type ] && elem[ "on" + type ].apply( elem, data ) === false ) {
            event.result = false;
        }
    }
    // prevent IE from throwing an error for some elements with some event types, see #3533
} catch (e) {}

So I guess either this has something to do with bug mentioned 3533 (which I can't check as dev.jquery.com is down at the moment) or there is some other IE bug. btw. do you get any warnings in the error console?

click event not trigerred in IE

3 Answers3