[wp-hackers] How do you get jQuery tabs working in Wordpress 2.8?

[Mark Cunningham]

Hi Gaarai,

Thanks for taking the time to reply.

> If you have any js code that relies on scripts that are loaded in the
> footer, you need to ensure that you wrap that code and tell it to not run
> until the document has fully loaded. This is easily done by wrapping the
> code in a jQuery(document).ready function. For example:
>
>   jQuery(document).ready( function() {
>       // Code that relies on scripts loaded in the footer.
>   } );

I was unaware of the change to have the scripts loaded in the footer,
but luckily I was already implementing my initialisation this way.

> One problem that I've already come across while doing this is that wrapping
> functions in that segment of code causes those functions to not be
> accessible to other js code that originates from outside that ready
> function. The solution I've created to work around this is to use an
> initializing function and use the ready function inside it. For example:

I tried this and it has made no difference. I'm not sure if that's the
source of the problem.

Thanks
Mark

2009/5/28 Gaarai <gaarai at gaarai.com>:
> I haven't run into your specific problem, but I believe that I know the
> cause. 2.8 has split the scripts into two groups: those that are added in
> the header and those that are added in the footer. jquery-ui-tabs is one of
> the many scripts that now loads in the footer. View the source, scroll to
> the bottom, and you'll see what I am talking about.
>
> If you have any js code that relies on scripts that are loaded in the
> footer, you need to ensure that you wrap that code and tell it to not run
> until the document has fully loaded. This is easily done by wrapping the
> code in a jQuery(document).ready function. For example:
>
>   jQuery(document).ready( function() {
>       // Code that relies on scripts loaded in the footer.
>   } );
>
> One problem that I've already come across while doing this is that wrapping
> functions in that segment of code causes those functions to not be
> accessible to other js code that originates from outside that ready
> function. The solution I've created to work around this is to use an
> initializing function and use the ready function inside it. For example:
>
>   function init_my_script() {
>       jQuery(document).ready( function() {
>           create_ui_tabs();
>           update_my_links();
>           // etc
>       } );
>   }
>
>   function create_ui_tabs() {
>       // Do stuff
>   }
>
>   function update_my_links() {
>       // Do stuff
>   }
>
>   init_my_script();
>
> This way you make your code run after all the scripts are loaded while also
> allowing the key functions to be accessible from other code.
>
> If you want to find out which scripts are loaded in the footer, check out
> the wp-includes/script-loader.php file of the latest trunk. There is a
> comment above the wp_default_scripts function that indicates which ones are
> loaded in the footer. You'll find that most of the scripts are now loaded in
> the footer. So, I recommend creating all future js code (and updating old js
> code) to have init functions with contents wrapped in the ready function. If
> you don't do this, you'll find a great amount of your js causing fatal
> errors and crashing the js execution.
>
> I hope that this helps you out Mark.
>
> Chris Jean
> http://gaarai.com/
> http://wp-roadmap.com/
>
>
>
> Mark Cunningham wrote:
>>
>> I've been doing some testing of my plugin on Wordpress 2.8 beta 2. I
>> am using the Wordpress built-in jQuery and jQuery tabs to generate
>> tabbed interface to my plugins options. But on the upgrade to 2.8, the
>> tabs no longer work any more. I've checked documentation for jQuery
>> tabs, and I don't appear to be doing anything wrong. Has anyone else
>> got jQuery tabs working on Wordpress 2.8?
>>
>> Thanks
>> Mark
>>
>
> _______________________________________________
> wp-hackers mailing list
> wp-hackers at lists.automattic.com
> http://lists.automattic.com/mailman/listinfo/wp-hackers
>



-- 
http://thedeadone.net
http://lostheroesrpg.com
http://irishgamingwiki.com