Ext.ux.menu.StoreMenu - Ajax Store as menu-item config

[wm003]

@Titina: Could you please provide some of your sample code? (and the json from the requests). i guess there is soemthing wrong in the definition of the menu-structure basically. Does it work, if you do _not_ use storemenu, but the usual menu?

[wm003]

json:
[{ 'text':'first entry','iconCls': 'iconclass1','handler': 'function(item) {alert('entry one is called '+item.text);}}]

you have used single quotes twice: To wrap the handler function and within this function, which will get a javascript syntax error:
And you forgot the last quote, so this has to crash
try this instead:

[{ 'text':'first entry','iconCls': 'iconclass1','handler': "function(item) {alert('entry one is called '+item.text);}"}]

[Titina]

The idea is to use the menus to choose the filters to be applied to a grid. The main menu applies one filter, the combo menu + submenu applies another filter.

The code is as follows:

    mainMenu= new Ext.ux.menu.StoreMenu({
        url:'py_menu_items',
        baseParams: {
        table: 'section',
        column1: 'section_id',
        column1: 'section_name',
        submenu: 'subMenu',
        hasSon: 1
        },
        listeners: {
            mouseover: function(t,e,menuItem){
                gridStore.baseParams['section'] = menuItem.getId();
                gridStore.baseParams['type'] = "";
            },
            click: function()
                {indicador.setText(gridStore.baseParams['section']); }
        }
    }); 

SubMenu code:

    subMenu= new Ext.ux.menu.StoreMenu({
        url:'py_menu_items',
        id: 'type_name',
        baseParams: {
        table: 'type',
        column1: 'type_id',
        column2: 'type_name',
        submenu: 'none',
        hasSon: 0
        },
        listeners: {
            mouseover: function(t,e,menuItem){
                gridStore.baseParams['type'] = menuItem.getId();
            },
            click: function()
                {indicador.setText(gridStore.baseParams['section'] + '/' + gridStore.baseParams['type']);
                }
        }
    }); 

The mouseover listener sets the filters to be used on the grid (section id if clicked is on the mainMenu, or section id + type id if the click event is on the subMenu). The click function then loads the grid with the filters.

The JSON response is:

[{"text": " section1" , "id":  "section1" , "handler": "function(){gridStore.baseParams['activeFilter'] = '1';}"  , "menu":  " subMenu" },
{"text": " section2" , "id":  "section2" , "handler": "function(){gridStore.baseParams['activeFilter'] = '1';}"  , "menu":  " subMenu" },
{"text": " section3" , "id":  "section3" , "handler": "function(){gridStore.baseParams['activeFilter'] = '1';}"  , "menu":  " subMenu" }]

The problem is, I have like 3 sections in the database, and the first subMenu is loaded ok on mouse over the first menu item. But right after I mouse over the second menu item, its subMenu isn't loaded, and then, over the third, the subMenu loads ok. If I mouse over then slowly, they all load, but thing is, no one will mouse over slowly.

Please, any help, idea would be extremely welcome, I have tried all sort of things and none works!

[Titina]

Ok, I did some tests. I created a normal menu with all the items already there, no ajax resquests, and another empty menu, which I populate with all the items queried from the db by an ajax resquest (using the normal menu, not the storeMenu). The first menu works normally, the second one has the same problem as the storeMenu, the second submenu doesn't appear when it should. By any chance, is that a bug from ext 2.x?

[wm003]

Is "subMenu" Object globally defined? When Storemenu evals the string to JS-code, the object "subMenu" must be in scope

[Titina]

yes, it is globally defined...

[wm003]

subMenu has a static id: 'type_name', but subMenu should be instanciated three times, so Ext will try to create 3 Objects with the same id which will result in an exception i guess. Thats, why the first menu works (because the id "type_name" was not defined yet) but all following subMenu fail to get rendered (because the id "type_name" already exists)
Try to delete the line

id: 'type_name', 

and see if it works now

[Titina]

no, it's only the immediate following subMenu that fails to render, the third works fine.
If I changed the order of the items where the mouse passes over, for example, I first pass over the second item, then go to the first one. The second item will render fine, the first no. If I go first over the first item, and then proceed to the second item and right after to the third item, the first and the third will render ok, the second no...

I deleted the id line, and it didn't work... one thing that I tried and kinda "worked", was to insert a mouseout listener with subMenu.hide(). The menu then worked, showing all the subMenus when they should. But then, I couldn't access the subMenus, 'cuz they would hide when I mouse out the main menu... it was a dumb idea, but maybe this will be any help to see where the problem is?

[saprot]

did you think of commercial license for StoreMenu, just like with your another great extension - DatePickerPlus?

[wm003]

did you think of commercial license for StoreMenu, just like with your another great extension - DatePickerPlus?

i will upgrade all demopages of my current and upcoming widges with options for commercial licenses soon.