Binding to NestedList Component from Web Service

[dboy221]

I am attempting to consume a WCF service that returns JSON in the format disclosed below. I am able to bind to the rootProperty "GetStormNoticesResult", however when attempting to access the child node "Notices", I keep get the root level listing. My question is aside from the examples on Nested List that provide a specific "text/item" format of JSON, how do I bind a NestedList where I do not have specific control over the format of the JSON or quite simply are there examples out there with Nested Lists that consume web services and not local .json data files? Thanks in advance.

{ "GetStormNoticesResult" : [ { "HurricaneSeason" : "/Date(1338523200000-0400)/",
        "ID" : 1,
        "Name" : "Tropical Storm/Hurricane Isaac",
        "Notices" : [ { "ID" : 1,
              "ImageUrl" : "http://upload.wikimedia.org/wikipedia/commons/thumb/f/f0/Isaac_2012_track.png/800px-Isaac_2012_track.png",
              "Message" : "Hurricane Isaac was a slow-moving tropical cyclone that caused severe damage along the northern Gulf Coast of the United States in late-August 2012. Prior to becoming a hurricane, Isaac attained one of the lowest barometric pressure measurements, on August 28, for any storm below hurricane strength, with a pressure of 976. The ninth tropical cyclone, ninth named storm, and fourth hurricane of the 2012 Atlantic hurricane season, Isaac developed from a tropical wave located east of the Lesser Antilles on August 21, strengthening into a tropical storm later that day. Isaac passed over Hispaniola and Cuba as a strong tropical storm, killing at least 34 people in Hispaniola, before it entered the Gulf of Mexico.",
              "PostDate" : "/Date(1349710020000-0400)/",
              "Subject" : "First Notice"
            },
            { "ID" : 2,
              "ImageUrl" : "http://i.imwx.com/common/articles/images/pecans_650x366.jpg",
              "Message" : "BATON ROUGE, La. — Hurricane Isaac has cut Louisiana's pecan harvest by 15 percent, Louisiana State University's AgCenter estimates.",
              "PostDate" : "/Date(1349710320000-0400)/",
              "Subject" : "Isaac Blamed for Reduced Pecan Crop"
            }
          ]
      },
      { "HurricaneSeason" : "/Date(715017600000-0400)/",
        "ID" : 2,
        "Name" : "Hurricane Andrew",
        "Notices" : null
      }
    ] }

[aconran]

This should be no problem to consume via a JsonStore.

Could you post your Store configuration?

[dboy221]

Here's the store configuration as configured with architect.

Ext.define('CatApp.store.NoticeTreeStore', {    extend: 'Ext.data.TreeStore',
    alias: 'store.noticeTreeStore',


    requires: [
        'CatApp.model.StormModel'
    ],


    config: {
        autoLoad: true,
        model: 'CatApp.model.StormModel',
        storeId: 'noticeTreeStore',
        proxy: {
            type: 'jsonp',
            url: 'http://localhost:49848/ResourceWebService.svc/GetStormNotices',
            reader: {
                type: 'json',
                idProperty: 'id',
                rootProperty: 'GetStormNoticesResult'
            }
        }
    }
});

[aconran]

Looks fine aside from "id" should be "ID".

What does your model look like?

[dboy221]

I changed the idProperty on the reader to 'ID' as you mentioned and now when drilling down from the root, I just get the "Loading" message. I'm not clear on what the 'ID' property is actually doing (as I've read the ? help icon on the property), can you clarify a little more on this purpose as it relates to the reader? Also here is the code for the model

Ext.define('CatApp.model.StormModel', {    extend: 'Ext.data.Model',
    alias: 'model.stormmodel',


    config: {
        clientIdProperty: 'stormModel',
        idProperty: 'ID',
        fields: [
            {
                name: 'ID',
                type: 'int'
            },
            {
                name: 'Name',
                type: 'string'
            },
            {
                name: 'HurricaneSeason',
                type: 'date'
            }
        ]
    }
});

[aconran]

It determines how to create records what field you have maps to an id.

You will also need to add a Notices field to get the data in the model.

[dboy221]

I went ahead and added "Notices" to the model and it still just hangs like it wants to load.

[aconran]

"hangs like it wants to load"?

[dboy221]

Sorry, LOL, guess I wasn't clear enough. I mean I am able to see the root of the JSON in this case GetStormResult in the NestedListView, however when selecting one of the nodes to drill down into the "Notices" child, it displays the "Loading" dialogue/module and nothing happens from there. The "Loading" dialogue just stays there spinning and basically kills the entire browser (both Chrome and Safari).

[dboy221]

Here is a screen shot of what is happening. I've selected "Tropical Storm/Hurricane Isaac" from the root level listing and attempt to go into the child "Notices", but this is the screen I'm presented with. This just sits here with the "Loading" Dialogue going and eventually kills the browser functionality all together.