I have upgraded an old WordPress site to the latest WordPress. PHP version was also upgraded. The site had a custom sidebar menu where opening and closing was controlled with a custom.js script. The menu no longer toggles.
After the upgrade the following error appeared in the console:
Uncaught TypeError: $submenu.collapse is not a function.
Not quite sure what the issue is.
JavaScript
x
26
26
1
jQuery('.menu-container li.menu-item-has-children').each(function() {
2
var $this = jQuery(this);
3
var $toggler = $this.find('a').first();
4
var $submenu = $this.find('.sub-menu');
5
6
$submenu.addClass('collapse');
7
8
if ($submenu.find('.current_page_item').length > 0) {
9
$submenu.addClass('in');
10
}
11
12
$toggler.on('touchstart click', function(e) {
13
e.preventDefault();
14
e.stopPropagation();
15
$submenu.collapse('toggle');
16
});
17
18
$submenu.on('shown.bs.collapse', function() {
19
$this.addClass('expanded');
20
});
21
22
$submenu.on('hidden.bs.collapse', function() {
23
$this.removeClass('expanded');
24
});
25
});
26
Advertisement
Answer
Collapse is a bootstrap function. The boostrap in the old theme, the dependency was not properly done.
Before Fix
JavaScript
1
3
1
wp_enqueue_script( 'secd-bootstrap-bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'), '20140319', true );
2
wp_enqueue_script( 'secd-bootstrap-custom', get_template_directory_uri() . '/js/custom.js', array('jquery'), $current_filemodtime );
3
After Fix
JavaScript
1
2
1
wp_enqueue_script( 'secd-bootstrap-custom', get_template_directory_uri() . '/js/custom.js', array('secd-bootstrap-bootstrap'), $current_filemodtime );
2