CODEWITHSUNDEEP
jquerywordpress
Christian Mayne
Christian Mayne

Reputation: 1749

jQuery accordion in Wordpress - Object has no method Accordion

I'm following a tutorial on building a jQuery Accordion with custom post types in Wordpress, and all works fine, apart from the actual Accordion, which returns the following error:

Uncaught TypeError: Object [object Object] has no method 'accordion'

Following advise found while googling, I've commented out the hard coded jQuery call in header.php, and jQuery is loade in functions.php as follows:

if ( !is_admin() ) {
  wp_deregister_script('jquery');
  wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"), false);
  wp_enqueue_script('jquery');
}

The code produces the following html:

<div id="#wptuts-accordion">
  <h3><a href="">Testimonial 1</a></h3>
  <div><p>This is testimonial Text</p></div>
  <h3><a href="">Testimonial 2</a></h3>
  <div><p>This is testimonial 2</p>
</div>

And the jQuery code that is causing the error is as follows:

jQuery(document).ready(function() { 
  jQuery("#wptuts-accordion").accordion();  
});

The tutorial code also includes the following which I assume just downloads the jQuery css and registers the scripts, but I wonder if this is the problem

add_action( 'wp_enqueue_scripts', 'wptuts_enqueue' );  
function wptuts_enqueue() {  
    wp_register_style('wptuts-jquery-ui-style', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/south-street/jquery-ui.css');  
    wp_enqueue_style('wptuts-jquery-ui-style');  
    wp_register_script('wptuts-custom-js', get_template_directory_uri() . '/testimonials/testimonials.js', 'jquery-ui-accordion', '', true);  
    wp_enqueue_script('wptuts-custom-js');  
}

jQuery appears to only load once on the page.

Any ideas how I could solve this problem?

Upvotes: 0

Views: 1009

Answers (1)

janw
janw

Reputation: 6662

This can be a bit confusing at first. wp_register_script the third argument has to be an array of dependencies. you have a string. So I should be:

wp_register_script(
    'wptuts-custom-js',
    get_template_directory_uri() . '/testimonials/testimonials.js',
    array('jquery', 'jquery-ui-accordion'), // an array of the js files it depend on
    '',
    true
);

General tip it you follow a tutorial give a link to the tutorial, in the question

Upvotes: 1

Related Questions