Autohide issue when using submenus

[rockshandy]

I'm using a context menu with the dynamic build options, and set it up so it's automatically hidden. Without triggering any submenus, the menu hides when my mouse leaves the element the menu was attached too. If I trigger another submenu to open, then move my mouse out, the context menu remains (with key capturing and other events in tact). It looks like the event triggered on leaving an item of the menu stops it's propagation, which prevents the menu mouseleave handler from updating opt.hovering.

From what I can tell, it seems like setting opt.hovering to false is necessary for the menu to be hidden properly. Is this a bug or some misconfiguration? I basically do the following in a function where I pass items into.

$.contextMenu({
  selector: selector,
  trigger: 'none',
  build: function($trigger, e) {
    e.pageX = pos.x;
    e.pageY = pos.y;

    return {
      pageX: pos.x,
      pageY: pos.y,
      items: items,
      delay: 500,
      autoHide: true
    };
  }
});

[CJLees01]

I hit this issue too.

I set autoHide: true in the global settings, and used the build function to build a menu with some sub-menus underneath it. If I mouseout of the context menu on an item without a sub-menu, then the whole context menu was removed as expected. But if I mouseout while a sub-menu was still visible, then the whole context menu (including the sub-menu) remained visible.

For anyone stumbling on this thread later, the simple fix seems to be to add autoHide: true inside your sub-menus like this:

$.contextMenu({
    selector: '#selector', 
    autoHide: true,                                                <= NOTE!
    build: function($trigger, e) {
        return {
            callback: function(key, opt) {}, 
            items: {
                fold1: {
                    name: "Header label...", 
                    autoHide: true,                            <= NOTE!
                    items: {
                        opt1: {
                                  name: "Sub-menu option 1"
                        }, 
                        opt2: {
                                  name: "Sub-menu option 2"
                        }
                        }
                }
       }
       }
    }
});

[bbrala]

Hmm, its even weirder, when you mouseout up out of the element everything seems fine...