1. #1
    Sencha User
    Join Date
    Oct 2007
    Location
    Berlin, Germany
    Posts
    889
    Vote Rating
    9
    wm003 will become famous soon enough

      0  

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

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


    Just a little widget to be able to create menus with stores as item-config:

    Demopage: http://www.lubber.de/extjs/storemenu

    Current Version v 0.2

    Revision History
    v 0.2 [2009/03/04]
    - added support for submenu ("menu" has to be delivered such as "handler")

    v 0.1 [2009/03/03]
    Initial release


    Simple call:

    PHP Code:
    var menu = new Ext.ux.menu.StoreMenu({
        
    url:'gimme_json_menu_entries.php',
        
    baseParams: {
            
    var_one'foo',
            
    var_two'bar'
        
    }
    }); 
    StoreMenu will show a loading indicator when the menu is opened the first time and renders the final menu after ajax-response.

    it would process a returned json like:

    Code:
    [
        {
            "text": "first entry",
            "iconCls": "iconclass1",
            "handler": "function(item) {alert('entry one is called '+item.text);}" 
        },
        '-',
        'some text',
        '-',
        {
            "text": "entry 2",
            "iconCls": "iconclass2",
            "handler": "function(item) {myextapp.my_public_method(1234,'abc');}" 
        },
        {
            "text": "submenu",
            "iconCls": "iconclass3",
            "menu": "new Ext.ux.menu.StoreMenu({url:'menu_entries.php'})"
        }
    ]
    Note, handler or menu-functions are delivered as string! StoreMenu takes care and creates real functions out of them.
    Attached Files

  2. #2
    Sencha - Training Team mrsunshine's Avatar
    Join Date
    Sep 2008
    Location
    Germany - Darmstadt
    Posts
    691
    Vote Rating
    12
    mrsunshine will become famous soon enough

      0  

    Default


    Cool, do you have a running demo?

  3. #3
    Sencha User
    Join Date
    Oct 2007
    Location
    Berlin, Germany
    Posts
    889
    Vote Rating
    9
    wm003 will become famous soon enough

      0  

    Default


    Quote Originally Posted by mrsunshine View Post
    Cool, do you have a running demo?
    yep(as of now, it was a question of time until somebody asks for a demopage)
    http://www.lubber.de/extjs/storemenu

  4. #4
    Sencha User
    Join Date
    Jan 2008
    Posts
    93
    Vote Rating
    0
    incaic is on a distinguished road

      0  

    Default


    Nice extension wm003!

    I tried it out, but am having some issues.

    My server returned JSON is:

    PHP Code:
    {
      
    statustrue,
      
    data: [{
        
    'first'
        
    ,'-'
        
    ,'second'
      
    }]

    I need to dynamically add a menu above StoreMenu, so have:

    PHP Code:
    m.menu.add({
      
    menu:new Ext.ux.menu.StoreMenu({
        
    url:this.url
        
    ,baseParams:{method:'getMenu'}
      })
    }) 
    I get the loading swirl, but then once call is complete the menu
    doesn't get populated. I get an empty submenu.

    I believe my problem is due to the extra "status:true" in the JSON returned
    from the server. I tried adding a "reader:this.reader" to your config code for
    SimpleStore, but it didn't work. The resulting code was:

    PHP Code:
    var menuRecord = new Ext.data.Record.create([
      {
    name:'config'mapping:'data'}  // EDIT: I use 'config' because I saw that your code used 'config' as a field.
    ]);

    var 
    menuReader = new Ext.data.JsonReader({
      
    successProperty:'status'
      
    ,root:'data'
    },menuRecord);

    m.menu.add({
      
    menu:new Ext.ux.menu.StoreMenu({
        
    url:this.url
        
    ,baseParams:{method:'getMenu'}
        ,
    reader:menuReader
      
    })
    }) 
    Any advice?

    Thanks.

  5. #5
    Sencha User
    Join Date
    Jan 2008
    Posts
    93
    Vote Rating
    0
    incaic is on a distinguished road

      0  

    Default


    ok, after closer inspection ...

    I found a simpler solution for myself, but had to alter wm003's code a bit.

    I changed the type of store from SimpleStore to JsonStore and
    added a root config as follows:
    (I swapped this for lines 46-52)

    PHP Code:
    this.store = new Ext.data.JsonStore({ // <- using JsonStore
      
    fields:['config'],
      
    url:this.url,
      
    baseParams:this.baseParams,
      
    root:this.root || 'data'                    // <- need to set appropriate root
    }); 
    This code works for servers that return JSON in the following format:

    PHP Code:
    {
      
    statustrue,
      
    data: [
        {
          
    "text" "First Entry"
          
    ,"iconCls" "iconclass1"
          
    ,"handler" "function(item) {alert('entry one is called '+item.text);}"
        
    }
        ,
    '-'
        
    {
          
    "text" "submenu"
          
    ,"iconCls" "iconclass2"
          
    ,"menu" "new Ext.ux.menu.StoreMenu({url:'...',baseParams:{...}})"
        
    }
      ]

    This works for me, hope it helps someone else.

  6. #6
    Ext User
    Join Date
    Feb 2009
    Posts
    7
    Vote Rating
    0
    baboog is on a distinguished road

      0  

    Default how to force Reload??

    how to force Reload??


    Hello , This is my first post (so sorry if i mess up)
    Nice extension btw..
    My question is on the demo how are u forcing "Force Reload of all menus on each access"???
    and can this be done for TreeLoader as well ??
    Thanks
    Baboog

  7. #7
    Sencha User
    Join Date
    Jan 2008
    Posts
    93
    Vote Rating
    0
    incaic is on a distinguished road

      0  

    Default


    StoreMenu uses this listener to force the reload:

    PHP Code:
    listeners:{
      
    'beforeshow':function(){this.loaded=false;}


  8. #8
    Sencha User
    Join Date
    Oct 2007
    Location
    Berlin, Germany
    Posts
    889
    Vote Rating
    9
    wm003 will become famous soon enough

      0  

    Default


    Quote Originally Posted by baboog View Post
    can this be done for TreeLoader as well ??
    just use the reload-method of the desired node of the tree.

  9. #9
    Ext User
    Join Date
    Feb 2009
    Posts
    7
    Vote Rating
    0
    baboog is on a distinguished road

      0  

    Default


    Thanks both of u for replying, really appreciate it

  10. #10
    Ext User
    Join Date
    Dec 2008
    Posts
    5
    Vote Rating
    0
    nofearnoreaper is on a distinguished road

      0  

    Default store menu store reload with different parameters

    store menu store reload with different parameters


    Hi, thanks for this menu, it's got me closer to actually finishing a project with EXTJS than anything else. I'd been banging my head against the issue of a dynamically loaded menu for far too long.

    If you see the code below:

    Code:
    var dynmen = new Ext.ux.menu.StoreMenu({
     
                url:'json_user_menu.asp',
                baseParams: {
                    userTXT: userValue,
                    mailTXT : emailValue
                            },
        listeners: {
         beforeshow: function() 
                        {
     
           this.loaded=false;  
             }
        }
     
       })
    I would have assumed that the store would reload every time you select the menu item? So as I pass a different BaseParam to the store the menu is populated with hrefs that use the new BaseParam as part of the querystring:

    Code:
     
    [{"text": "Player Search","iconCls": "iconclass1", "href":"inputString.asp?key=test1234", "hrefTarget":"_blank"},{"text": "Blue Page","iconCls": "iconclass1", "href":"cgi-bin/admin.exe?type=test1234\&player=", "hrefTarget":"_blank"},{"text": "White Page","iconCls": "iconclass1", "href":"user.asp?user=test1234", "hrefTarget":"_blank"},{"text": "Current Player Status","iconCls": "iconclass1", "href":"user_tables.asp?player=test1234", "hrefTarget":"_blank"},{"text": "Credit Status","iconCls": "iconclass1", "href":"user_credit.asp?player=test1234", "hrefTarget":"_blank"},{"text": "Real Money Transfers","iconCls": "iconclass1", "href":"user_transfers.asp?switch=Real\&player=test1234", "hrefTarget":"_blank"}]
    You see from the code above the userID passed is 'test1234' . the user ID is passed from a successful query on the database which is parameterised by a form field where the userID can be input. I want to reload the staor every time a new search is performed on the database returning a new userID, so changing the querystring of the hrefs in the store menu. What is the best way to achieve this, any help would be greatly appreciated.

    Thanks