DHTML Menu assigns id="dhtml_menu#" and class="collapsed" to non-selected menus - breaks non-DHTML menus [#401990]

Hello,

Thank you for an excellent module - I'm not sure I could work without it!

I am experiencing an issue or have found a bug that I am hoping to find a fix for. I have searched through all other issues but have not found a solution.

I am working with a Suckerfish drop-down menu (CSS based) that I have assigned as a new menu "Suckerfish." I have assigned DHTML Menu to work with the "Navigation" menu. Both menus work fine as long as I DO NOT enable any of the DHTML Menu Effects. As soon as I do, my Suckerfish menu items will not expand if I first click on any links within the DHTML Menu ("Navigation" menu).

Even though I have chosen the option to disable "Menus without DHTML" for the Suckerfish menu, DHTML Menu still assigns an ID="dhtml_menu#" to all items within the Suckerfish menu. Also - when I enable any of the DHTML Menu Effects, DHTML Menu assigns a class="collapsed" to menu items that I have configured as expanded within Drupal's menu Admin page.

Here are some partial code examples generated to display class/ID and style assignments:

(1.) Suckerfish without DHTML MENU

Company
- About Us

Comments

Comment #1

FWE CreditAttribution: FWE commented 14 March 2009 at 18:07

Sorry for the above - I pulled my head out of my rear-end and have added code tags :-).

Here are some partial code examples generated to display class/ID and style assignments:

(1.) Suckerfish without DHTML MENU

<ul class="menu">
   <li class="expanded first"><a href="/drupal6/node/4" title="">Company</a>
      <ul class="menu">
         <li class="leaf first"><a href="/drupal6/node/15" title="">About Us</a></li>

(2.) Suckerfish with DHTML MENU - DHTML effects DISABLED

<ul class="menu">
   <li class="expanded first no-dhtml"><a href="/drupal6/node/4" title="" id="dhtml_menu-171">Company</a>
      <ul class="menu">
         <li class="leaf first no-dhtml"><a href="/drupal6/node/15" title="" id="dhtml_menu-195">About Us</a></li>

(3.) Suckerfish with DHTML MENU - DHTML effects ENABLED

<ul class="menu">
   <li class="first no-dhtml collapsed"><a href="/drupal6/node/4" title="" id="dhtml_menu-171">Company</a>
      <ul style="display: none;" class="menu">
         <li class="leaf first no-dhtml"><a href="/drupal6/node/15" title="" id="dhtml_menu-195">About Us</a></li>

A few questions...

(1.) Is DHTML Menu supposed to assign ID's, Classes & styles (e.g. "display:none" - ex. 3 above) to menus that have been configured as "Menus without DHTML?" (I'm not certain if this is the correct behavior)

(2.) I found a patch with this post (#332947: Do not touch menus where DHTML is disabled.) however, it appears to have already been applied to 6.x-3.x-dev.

Can anyone point me in a direction to find a solution for the above - THANK YOU!

Comment #2

FWE CreditAttribution: FWE commented 18 March 2009 at 15:34

I believe I have found the issue...but not the resolution.

After further review I believe that DHTML menus auto assigns ID's/Classes to all menus. However, it appears that in my situation the following change is what conflicts with Suckerfish:

(1.) Suckerfish 1st level flyout example (NO DHTML Menus):
<ul class="menu">

(2.) Suckerfish 1st level flyout example (WITH DHTML Menus):
<ul style="display: none;" class="menu">

I believe the assignment of ID's/Classes doesn't influence functionality - however, it is the addition of <ul style="display: none;" class="menu"> that is preventing it from working.

With this in mind - does anyone have any suggestions for disabling "display:none" for menus that are configured to NOT use DHTML menus?

Any assistance is greatly appreciated - thank you!

Comment #3

FWE CreditAttribution: FWE commented 22 March 2009 at 21:32

I have configured DHTML Menu to disregard my custom menu, yet DHTML Menu still assigns a "style="display:none" to my menu items when using animations.

Does anyone know how to disable the CSS tag - "style="display:none" - when using animations with DHTML Menu? I would think this has a wider effect for other users as well.

Any help would be GREATLY appreciated!

Comment #4

FWE CreditAttribution: FWE commented 27 March 2009 at 17:01

Category:

support

» bug

I have done some additional testing and it appears that this is a bug.

When disabling DHTML Menus for specific Drupal menus, DHTML Menu will still assign the CSS style "display:none" in addition to class "no-dhtml" - IF one chooses to use any of the animations.

The style is dynamically generated on the page and renders custom CSS menus non-functional (e.g. Suckerfish).

In a nutshell - Classes/Styles from "dhtml_menu.js" are applied to menus that are configured to be ignored by DHTML Menus.

Comment #5

cburschka

they

CreditAttribution: cburschka commented 5 April 2009 at 00:17

style="display:none"

Sorry, you're not talking about an actual addition of this to the HTML code, are you? Because DHTML Menu is incapable of adding that - I've searched through the entire code and found no place that assigns a "style" attribute.

If this is added by Javascript, then yes, there is a bug in the "ignore menu" feature. It shouldn't do anything at all with ignored menus; no markup and no Javascript. I'll check this in a moment.

Comment #6

cburschka

they

CreditAttribution: cburschka commented 5 April 2009 at 00:29

On further examination, I have found that DHTML Menu does add ID attributes to ignored menus. I will make a patch that changes this.

But I still have no idea where the style="display:none" is coming from, or what it has to do with animations.

Comment #7

FWE CreditAttribution: FWE commented 8 April 2009 at 18:23

Hi Arancaytar - thanks for your assistance!

I have "dug into the code" for several hours to find where/why this is happening - to no avail. I am 100% certain that it's a jQuery issue as the CSS style="display:none" is only applied to the non-DHTML menu UL tags after enabling the animations within DHTML menus - and it is dynamically added after interaction with DHTML Menus (I found this using the Dev module in Firefox - "View Generated Source").

It appears that when animations are activated - somewhere jQuery is adding the class like so:

Menu tag with DHTML menu animations disabled:  <ul class="menu">

Menu tag with DHTML menu animations enabled:  <ul style="display: none;" class="menu">

I first thought that the issue was within "dhtml_menu.js" as I found the following in the code:

Line 80:  else $(li).find('ul:first').css('display', 'none');

Line 87:  else $(li).find('li.expanded').find('ul:first').css('display', 'none');

Line 133:  else $(siblings).find('ul:first').css('display', 'none');

However, commenting these sections out did nothing to resolve the issue. This one is definitely a "head scratcher!"

I will do some more "digging" and post back what I find. Thanks again for your comments!

Comment #8

dvasquez CreditAttribution: dvasquez commented 5 April 2010 at 15:40

Hello man!

I've an issue... If i want apply DHTML_Menu to Taxonomy_Context menu, how can i do? I need a path? What do you think about this?

Thanks!

Comment #9

mattcasey CreditAttribution: mattcasey commented 8 July 2011 at 03:05

@cburschka, DHTML Menu is overwriting the id's from the Menu Attributes module even when I disable the menu from settings. Did you ever submit a patch?

[FIX]

This seemed too easy, so it'd be nice if someone could check my work! To prevent the id being added to disabled menus, I changed line 66 of dhtml_menu.module to this:

  if (isset($link['menu_name']) && isset($link['mlid']) && !$disabled[$link['menu_name']]) {

[FIX UPDATE]
My fix was a little blunt. This fix still lets DHTML Menu mark the menus 'disabled' so they get the no-dhtml class. Starting on Line 64:

  // Only work with menu items that have an mlid and a menu name.
  if (isset($link['menu_name']) && isset($link['mlid'])) {
    // Some themes use options, others use localized_options. Populate both.
    if (empty($disabled[$link['menu_name']])) {
	  $link['localized_options']['attributes']['id'] = 'dhtml_menu-' . _dhtml_menu_unique_id($link['mlid']);
      $link['options']['attributes']['id'] = $link['localized_options']['attributes']['id'];
    } else {
      // Disabled items are now marked. They must still be added to the stack to pass information within this module.
	  $link['dhtml_disabled'] = TRUE;
    }