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.
jQuery('.menu-container li.menu-item-has-children').each(function() { var $this = jQuery(this); var $toggler = $this.find('a').first(); var $submenu = $this.find('.sub-menu'); $submenu.addClass('collapse'); if ($submenu.find('.current_page_item').length > 0) { $submenu.addClass('in'); } $toggler.on('touchstart click', function(e) { e.preventDefault(); e.stopPropagation(); $submenu.collapse('toggle'); }); $submenu.on('shown.bs.collapse', function() { $this.addClass('expanded'); }); $submenu.on('hidden.bs.collapse', function() { $this.removeClass('expanded'); }); });
Advertisement
Answer
Collapse is a bootstrap function. The boostrap in the old theme, the dependency was not properly done.
Before Fix
wp_enqueue_script( 'secd-bootstrap-bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'), '20140319', true ); wp_enqueue_script( 'secd-bootstrap-custom', get_template_directory_uri() . '/js/custom.js', array('jquery'), $current_filemodtime );
After Fix
wp_enqueue_script( 'secd-bootstrap-custom', get_template_directory_uri() . '/js/custom.js', array('secd-bootstrap-bootstrap'), $current_filemodtime );