Search jQuery

jQuery Forum

Using jQuery UI

pwc1011

Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

in Using jQuery UI • 12 years ago

Regarding the following, I've tried 1.8 up to 1.8.4...

The following error only happens in IE 8

I've stripped out anything other than the most basic functionality.

Scenario:

1. example page layout...

<body>

<div id='tab1>{tab defition...}</div>

</div>

</body>

2. Initialize tabs:

$("#tab1").tabs( );

3. Bind to tabsselect function to load data to tab:

$t.bind('tabsselect', function (event, ui) {

return $(this).LoadTabFunc(event, ui);

});

4. LoadTabFunction retrieves (via post) and loads the result to the tab panel... $(ui.panel).html(data);

Tabs load as expected and work fine.

User then selects a button and new content is loaded and inserted to workarea $("#workarea").html(data);

Once this happens, IE returns the following message "'events' is null or not an object". I've traced through and the errors comes from the jquery.extend:cleanData routine. Specifically, as jquery loops through the cache for elements from $("#workarea") during the empty() prior to the post() of the new data, it does not find some of the objects said to exist based on the elements array (jquery.expando).

This error only happens in IE. FireFox, Chrome and Safari do not have the problem.

I've exhausted all the options I can think of...

- destroy tabs prior to load

- remove all the content from the prior panel prior to load of new content in new panel

- i even created a panel that loaded no data. selected it last and made sure all the panels were cleared before trying to replace the tabs content, but no luck... still get the error.

PLEASE help.

Thanks!

Replies(5)

vinay

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

12 years ago

I am having a problem which might be the same as yours. I got it to work with a hack described here: http://dev.jquery.com/ticket/6925
Modifying jquery core code directly is probably bad practice, but if you're like me, you might be in a hurry to fix this thing. Good luck

pwc1011

Re: Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

12 years ago

Thanks vinay, I think that post confirms there is some kind of funky bug. Why it only happens when I load content through ajax and the tabsselect event is strange. I can take the approach to resolving the problem, but it seems that finding the actual source would be better.

ollie2893

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

12 years ago

I am not sure I fully understand your use of #workarea (is it sometimes a ui-tabs, sometimes something else?). It seems that you may have stumbled upon a problem with IE's garbage collector. Sounds like a reference to an event handler is still there, when the handler itself is already gone. I have no great suggestion but thought I mention that your coding strikes me as somewhat anomalous. When constructing dynamic tabs, the docs suggest this simple href syntax:

<div id="example">
     <ul>
         <li><a href="ahah_1.html"><span>Content 1</span></a></li>
         <li><a href="ahah_2.html"><span>Content 2</span></a></li>
         <li><a href="ahah_3.html"><span>Content 3</span></a></li>
     </ul>
</div>

I am guessing that your "LoadTabFunc" animates some backing JS code?  This would be better handled, I think, through the "tabsload" event/.load method.  Your code fragment reads as though you trigger a "load", an event intended to occur once only, on "tabsselect", an event that's expected to fire more than once.

I am not sure that a rewrite will fix your problem. I just figure that the documented way for loading AJAX tabs would have been tested (in IE8, ...) before the release of jQuery, and thus has greater chances of working. Your approach seems a little less orthodox.

Just a thought.

pwc1011

Re: Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

12 years ago

ollie2893,

I'm not sure where to start with your comments, but my post was simply a simplified version. "workarea" is just a div on a page where content is loaded from ajax. At one point it contains the definition for a tab. Another time, it contains some other content.

As far as loading content into a tab via ajax, jquery does not support post for loading content into a tab. If post is needed (separate discussion), the only way to do it is to bind to one of the tab events. Documentation on the tabsload event states "This event is triggered after the content of a remote tab has been loaded." So while this event could be used, a better option in my opinion is the tabsselect event. When this event is fired, our code performs a check, cleanup and then loads the content into the new tab's ui.panel area.

All in all, it does not seem the error should be happening, regardless of where the load takes place. The bigger issue is why are objects being removed or not being removed from the cache as expected. Moreover, why is there not a try/catch to manage the error if there is.

And finally, based on ticket 6925 and how IE is the only browser where this issue occurs, why does anyone still use IE :-)

Patrick

ollie2893

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

12 years ago

based on ticket band how IE is the only browser where this issue occurs, why does anyone still use IE :-)

Indeed (sigh)...

"workarea" is ... At one point it contains the definition for a tab [at] another, it contains some other content.

Ok, so I understood your OP correctly. I was concerned because of the way that the UI widgets have a habit of hi-jacking the parent div, your "workarea". There's a lot of event handling typically attached to that parent and if IE had some problem, as sounds like it, with orphaned event handlers, then you might have better success with $("#workarea").remove() than with $(t).tabs("destroy"). Put another way, since re-creating the "workarea" might be hard work (with an uncertain pay-off), how about trying a redundant DIV inside the "workarea", wrapped around the UL? It wouldn't be the first redundant DIV employed in the pursuit of making IE behave ...

jquery does not support post for loading content into a tab. If post is needed, the only way to do it is to bind to one of the tab events.

Oh, I missed the (post) bit in the OP. My bad. So you are late-loading via $.ajax and you have some logic to make sure you aren't loading twice, which isn't rocket-science. Fair enough.

Top Reply

Response title

Attachments

jQuery Forum

Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Replies(5)

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Re: Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Re: Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Re: Load using tabsselect causes 'events' is null... error in IE (urgent help needed)

Statistics

Tags

Actions