CODEWITHSUNDEEP
javascriptjqueryasp.netclickinternet-explorer-11
sampa
sampa

Reputation: 639

ASP.NET JQuery .click() not working in IE11

The following .click()-method is fired in Chrome without problems. In Internet Explorer it is only fired if I refresh the page (F5). If I access the page by entering the url (or redirected by a buttonclick from an other page) the .click-method is NOT fired.

But if I put an alert("?") before the .click() it works in IE too!

Why does it not work correctly in IE? I can't let the alert() be there...

$(window).load(function() {
    //Fake click on the last used Tab
    alert("?");
    $("#"+GetCookie("lastTab["+window.location.pathname+"]")).click();
});

=> The available (clickable) tabs are created in 

jQuery(document).ready(function($) {    
...
});

EDIT From comments:

They are created inside the .read(function($) in this way: 

$("#HillbillyTabs").append('<li><a href="#Tab' + upperIndex + '" id="TabHead' + upperIndex + '" onclick="SetCookie(this.id);">' + title + '</a></li>').after('<div id="Tab' + upperIndex + '"></div>');

After Container is created after the script: 

<div id="tabsContainer"><ul id="HillbillyTabs"></ul></div>

Upvotes: 0

Views: 1315

Answers (3)

Mark Schultheiss
Mark Schultheiss

Reputation: 34168

Do not try to inject the function call, but rather add an event listener to the code. For example: (I made up some variables as your code did not indicate some things here)

var upperIndex = $('#tabsContainer').find('ul').length;
var title = "mytitle";
var newHeadId = 'TabHead' + upperIndex;
var newTabId = 'Tab' + upperIndex;

$("#HillbillyTabs").append('<li><a href="#' + newTabId + '" id="' + newHeadId + '">' + title + '</a></li>').after('<div id="' + newTabId + '"></div>');

$("#HillbillyTabs").on('click', '#' + newHeadId, function() {
  console.log(this.id);
  SetCookie(this.id);
});

Upvotes: 1

sampa
sampa

Reputation: 639

Got the solution.

Curiously the fadeIn in the .load doesn't work for IE too (like the .click)

$(window).load(function() {
    //Fake click on the last used Tab
    alert("?");
    $("#"+GetCookie("lastTab["+window.location.pathname+"]")).click();
    // When the page has loaded in Chrome
    $("#DeltaPlaceHolderMain").fadeIn(0);
});

For fading in I had to put the method immediately after the creation-method for the tabs (inside the .ready()) instead of the end of .ready().

There is now also the .click and it works now for IE.

jQuery(document).ready(function($) {    
    setTimeout(function() {
        ...
        //Creation of tabs
        $("#tabsContainer").tabs();
        //Fake click on the last used Tab
        $("#"+GetCookie("lastTab["+window.location.pathname+"]")).click();
        // When the page has loaded in IE
        $("#contentBox").fadeIn(0);
    }, 0); 
//.click NOT here
});

Thanks for your fast responses and tips!

Kind regards

Upvotes: 0

B&#233;ranger
B&#233;ranger

Reputation: 673

It seems IE does not recognize :

$(window).load()

You could try :

window.onload = function() {
     $("#"+GetCookie("lastTab["+window.location.pathname+"]")).click();
};

Upvotes: 0

Related Questions