Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    24
    Answers
    2
    Vote Rating
    0
    essex is on a distinguished road

      0  

    Default Answered: php json_encoded array and nestedlist

    Answered: php json_encoded array and nestedlist


    Hello,

    Is there anything special that needs to be done to special to make an array work in the nested list besides JSON encoding it in PHP. I have tried several times to prepare my array for the nested list but I get nothing.

    here is the code that produces my array

    Code:
     foreach ($channels as $index => $c)
                {
                    $node = $c['Content']['call_letters'];
                   // var_dump($node);
                  //  exit();
                
                     if ($node == $c['Content']['call_letters'])
                     {
                        //$refactor[$node][$index] = $c['Content'];
                       
                        $refactor[$node][$index] =
                        array('text' => $node,
                            'items'=> $c['Content']
                           );
                     }           
    
                }

    here is my array:

    Code:
    
    array   'KKYO' =>      array       0 =>          array           'text' => string 'KKYO' (length=4)           'items' =>              array               '_id' => string '4f128b336930f31137081969' (length=24)               'call_letters' => string 'KKYO' (length=4)               'channel_name' => string 'KKYO-Kyoto' (length=10)               'bcast_channel' => int 100               'start_time_utc' => float 1326650400               'program_id' => string '99344001' (length=8)               'title' => string 'Kyoto' (length=5)       1 =>          array           'text' => string 'KKYO' (length=4)           'items' =>              array               '_id' => string '4f128b336930f3113708196a' (length=24)               'call_letters' => string 'KKYO' (length=4)               'channel_name' => string 'KKYO-Kyoto' (length=10)               'bcast_channel' => int 100               'start_time_utc' => float 1326657600               'program_id' => string '99344001' (length=8)               'title' => string 'Kyoto' (length=5)       2 =>          array           'text' => string 'KKYO' (length=4)           'items' =>              array               '_id' => string '4f128b336930f3113708196b' (length=24)               'call_letters' => string 'KKYO' (length=4)               'channel_name' => string 'KKYO-Kyoto' (length=10)               'bcast_channel' => int 100               'start_time_utc' => float 1326664800               'program_id' => string '99344001' (length=8)               'title' => string 'Kyoto' (length=5)
    
    'KSEO' =>      array       15 =>          array           'text' => string 'KSEO' (length=4)           'items' =>              array               '_id' => string '4f128b2e6930f31137081950' (length=24)               'call_letters' => string 'KSEO' (length=4)               'channel_name' => string 'KSEO-Seoul' (length=10)               'bcast_channel' => int 101               'start_time_utc' => float 1326650400               'program_id' => string '99345001' (length=8)               'title' => string 'Seoul' (length=5)       16 =>          array           'text' => string 'KSEO' (length=4)           'items' =>              array               '_id' => string '4f128b2e6930f31137081951' (length=24)               'call_letters' => string 'KSEO' (length=4)               'channel_name' => string 'KSEO-Seoul' (length=10)               'bcast_channel' => int 101               'start_time_utc' => float 1326657600               'program_id' => string '99345001' (length=8)               'title' => string 'Seoul' (length=5)       17 =>          array           'text' => string 'KSEO' (length=4)           'items' =>              array               '_id' => string '4f128b2e6930f31137081952' (length=24)               'call_letters' => string 'KSEO' (length=4)               'channel_name' => string 'KSEO-Seoul' (length=10)               'bcast_channel' => int 101               'start_time_utc' => float 1326664800               'program_id' => string '99345001' (length=8)               'title' => string 'Seoul' (length=5)       18 => 
    my nested list code
    Code:
    Ext.setup({
        name: 'mapp',
        onReady: function() {
            Ext.define('Channels', {
                extend: 'Ext.data.Model',
            fields: [
                            {
                                name: "text",
                                type: "string"
                            }
                            ]
            });
    
            channelstore = Ext.create('Ext.data.TreeStore', {
                autoLoad: true,
                model: "Channels",
                defaultRootProperty: 'text',
                proxy: {
                    type: 'ajax',
                    url : '/channels/channelList',
                    reader: {
                        type: 'json',
                        root: 'text'
                    }
                }
            });
    
    
            channelPanel = Ext.create('Ext.NestedList', {
                fullscreen: true,
                title: 'Channels',
                displayField: 'text',
                store: channelstore
            });
    
                console.log(channelstore);
        }
    });
    Any input is greatly appreciated.

  2. Hi Essex,

    Here,

    i have attached the code.. it is working absolutely fine.. there is a possibility of u not getting the list working at all for json for a reason .. u might be not loading the same from server. Thats because of sandbox security ...
    Plus, have made some modifications..
    1 - added root : {} - This is a must / compulsary as there is a bug in 2.0 for nested list. Without this, the list of elements just doubles up.
    2 - in your data.. i noticed that there were no items .. other then the root. And all the items @end .. (last in the tree) needs to have 1 more attributed / element added to it... leaf = true.. Else it will continue with the node.. and will go in an endless loop. Thats the same thing u will notice for all the elements in the list .. except for element no 1

    Enjoy the code..
    I ran it on the server .. (apache) .. and it runs absolutely perfect .. without any issue.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Answers
    3541
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    What does your JSON look like? Here is a sample:

    Code:
    {
        "children": [
            {
                "cls": "file",
                "fileName": "Ajax.js",
                "id": "./Ajax.js",
                "leaf": true
            },
            {
                "cls": "folder",
                "fileName": "form",
                "id": "./form",
                "children": [
                    {
                        "fileName": "Panel.js",
                        "id": "form/Panel.js",
                        "leaf": true,
                        "cls": "file"
                    },
                    {
                        "fileName": "Field",
                        "id": "field/Field",
                        "cls": "folder",
                        "children": [
                            {
                                "fileName": "Number.js",
                                "id": "field/Number.js",
                                "leaf": true,
                                "cls": "file"
                            },
                            {
                                "fileName": "Text.js",
                                "id": "field/Text.js",
                                "leaf": true,
                                "cls": "file"
                            }
                        ]
                    }
                ]
            },
            {
                "cls": "folder",
                "fileName": "util",
                "id": "./util",
                "children": [
                    {
                        "fileName": "TapRepeater.js",
                        "id": "util/TapRepeater.js",
                        "leaf": true,
                        "cls": "file"
                    }
                ]
            }
        ],
        "text": "."
    }
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    24
    Answers
    2
    Vote Rating
    0
    essex is on a distinguished road

      0  

    Default My JSON

    My JSON


    Code:
    [[{"text":"KKYO","items":{"_id":"4f128b336930f3113708196d","call_letters":"KKYO","channel_name":"KKYO-Kyoto","bcast_channel":100,"start_time_utc":1326679200,"program_id":"99344001","title":"Kyoto"}},{"text":"KKYO","items":{"_id":"4f128b336930f3113708196e","call_letters":"KKYO","channel_name":"KKYO-Kyoto","bcast_channel":100,"start_time_utc":1326686400,"program_id":"99344001","title":"Kyoto"}},{"text":"KKYO","items":{"_id":"4f128b336930f3113708196f","call_letters":"KKYO","channel_name":"KKYO-Kyoto","bcast_channel":100,"start_time_utc":1326693600,"program_id":"99344001","title":"Kyoto"}}]]

  5. #4
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    24
    Answers
    2
    Vote Rating
    0
    essex is on a distinguished road

      0  

    Default


    I apologize for not formatting my JSON more clearly:

    Code:
    [
    [{"text":"KKYO",
    "items":{"_id":"4f128b336930f3113708196d",
    "call_letters":"KKYO",
    "channel_name":"KKYO-Kyoto",
    "bcast_channel":100,
    "start_time_utc":1326679200,
    "program_id":"99344001",
    "title":"Kyoto"}
    },
    
    {"text":"KKYO",
    "items":{"_id":"4f128b336930f3113708196e",
    "call_letters":"KKYO",
    "channel_name":"KKYO-Kyoto",
    "bcast_channel":100,
    "start_time_utc":1326686400,
    "program_id":"99344001",
    "title":"Kyoto"}
    },
    
    {"text":"KKYO",
    "items":{"_id":"4f128b336930f3113708196f",
    "call_letters":"KKYO",
    "channel_name":"KKYO-Kyoto",
    "bcast_channel":100,
    "start_time_utc":1326693600,
    "program_id":"99344001",
    "title":"Kyoto"}
    }
    ]
    ]

  6. #5
    Sencha User blakdronzer's Avatar
    Join Date
    Jan 2011
    Location
    Mumbai, India
    Posts
    27
    Answers
    3
    Vote Rating
    0
    blakdronzer is on a distinguished road

      0  

    Thumbs up


    Hi essex,

    It seems you need to restructure your nested list of array / json.
    the structure that may be possible for your solution will be like the following

    [ [ { "items" : {
    "text" : "KKYO",
    "bcast_channel" : 100,
    "call_letters" : "KKYO",
    "channel_name" : "KKYO-Kyoto",
    "program_id" : "99344001",
    "details" : {
    "_id" : "4f128b336930f3113708196d",
    "start_time_utc" : 1326679200,
    "title" : "Kyoto"
    },
    {
    "_id" : "4f128b336930f3113708196e",
    "start_time_utc" : 1326686400,
    "title" : "Kyoto"
    },
    {
    "_id" : "4f128b336930f3113708196f",
    "start_time_utc" : 1326693600,
    "title" : "Kyoto"
    }
    }
    ] ]

    This should possibly help / solve the problem.

  7. #6
    Sencha Premium Member
    Join Date
    Nov 2011
    Posts
    24
    Answers
    2
    Vote Rating
    0
    essex is on a distinguished road

      0  

    Default


    Thank you blakdronzer for you help. I am still at getting a blank list. here is some thing I've done for a test.

    Instead of using a proxy I just include a sample of my json in a variable called data on my nested list js page.

    Code:
    var channelPanel;
    var channel;
    
    Ext.setup({
        name: 'mrdvr',
        onReady: function() {
            Ext.define('Channels', {
                extend: 'Ext.data.Model',
            fields: [
                            {
                                name: "text",
                                type: "string"
                            }
                            ]
            });
    
    
            data = {"items":[{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KKYO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KSEO"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KTOK"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KJEJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KTAJ"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KBKH"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"},{"text":"KTDS"}]};
    
            channelstore = Ext.create('Ext.data.TreeStore', {
                autoLoad: true,
                model: "Channels",
                defaultRootProperty: 'items',
                root : data
            });
    
    
            channelPanel = Ext.create('Ext.NestedList', {
                fullscreen: true,
                title: 'Channels',
                displayField: 'text',
                store: channelstore
            });
    
                console.log(channelstore);
        }
    });


    This works fine and show one level of data as it should. But when I change my treestore and add a proxy - it no longer populates the nestedlist.

    Code:
     channelstore = Ext.create('Ext.data.TreeStore', {
                autoLoad: true,
                model: "Channels",
                defaultRootProperty: 'items',
                proxy: {
                    type: 'ajax',
                    url : '/channels/channelList',
                    reader: {
                        type: 'json',
                        root: 'items'  
                    }
                }
            });