1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    19
    Answers
    3
    Vote Rating
    2
    marcuswu is on a distinguished road

      0  

    Default Answered: How to show associated data in a list

    Answered: How to show associated data in a list


    I have a list where the item template needs to access data from the record as well as from an associated record. getAssociatedData() is the synchronous call I need, but the associated data must have already been loaded. Loading data on the associated store is an asynchronous call, so if I do that in prepareData I won't have what I need before the return.

    How can I be sure to have access to the associated data for my record when prepareData is called?

  2. I ended up converting my template based list to a component based dataview. Here's what I did:
    • I built the component as one usually would to start with, then modified it as follows.
    • I left the field which relies on the associated data out of the dataMap.
    • I overrode updateRecord on the component to retrieve the associated data store and run load() on it passing in a callback. This way as soon as the component receives its record it begins looking up the required data.
    • I then wrote my data store load callback which compiles the data I need from the returned records. Once I've built out the data I need, I set the contents of the proper item within the component. This basically takes the place of the dataMap entry.
    I think this is the most "correct" way to do this I can think of and it works very well. By the time the list is rendered, all of the data has been returned and rendered as well (all my data is local, so it's quick).

    It may be a little bit of overkill to use components for these list items as they are simple, but I think the logic is cleaner than what I would have had to do to accomplish something similar with a template based list. I'm willing to trade the extra memory use for clean logic here.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,604
    Answers
    3449
    Vote Rating
    818
    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


    If the data is already present then using prepareData will be fine as getting the data is sync but if you have to load the data then it is async and you would then need to do something different.
    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 User
    Join Date
    Sep 2011
    Posts
    19
    Answers
    3
    Vote Rating
    2
    marcuswu is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    ... but if you have to load the data then it is async and you would then need to do something different.
    Right, this is exactly my situation and what my problem is. What is, "something different"? Am I going to have to bind to the store's refresh, do a getRange(), loop over it, retrieve the associated store, and call load() on each one, setting some counter for how many loads are running, decrementing the counter in the load callback, and finally refreshing the list once the counter reaches 0? That seems like a lot of complication to simply add a field from an associated record to a list template.

    It'd be nice if prepareData passed a callback function you could pass the data to once you had it so that asynchronous work could be done prior to returning the data.

    Perhaps I should go through the work of converting my list subclass to a component dataview subclass and in updateRecord set an event handler on the associated store's load event to update the component.

  5. #4
    Sencha User
    Join Date
    Dec 2007
    Posts
    19
    Vote Rating
    0
    cbandes is on a distinguished road

      0  

    Default


    I spent the better part of last week trying to do this and eventually decided just to ditch sencha's whole data model and go straight to my database w/ jquery ajax calls (thankfully jquery and sencha coexist happily)

  6. #5
    Sencha User
    Join Date
    Sep 2011
    Posts
    19
    Answers
    3
    Vote Rating
    2
    marcuswu is on a distinguished road

      0  

    Lightbulb


    I ended up converting my template based list to a component based dataview. Here's what I did:
    • I built the component as one usually would to start with, then modified it as follows.
    • I left the field which relies on the associated data out of the dataMap.
    • I overrode updateRecord on the component to retrieve the associated data store and run load() on it passing in a callback. This way as soon as the component receives its record it begins looking up the required data.
    • I then wrote my data store load callback which compiles the data I need from the returned records. Once I've built out the data I need, I set the contents of the proper item within the component. This basically takes the place of the dataMap entry.
    I think this is the most "correct" way to do this I can think of and it works very well. By the time the list is rendered, all of the data has been returned and rendered as well (all my data is local, so it's quick).

    It may be a little bit of overkill to use components for these list items as they are simple, but I think the logic is cleaner than what I would have had to do to accomplish something similar with a template based list. I'm willing to trade the extra memory use for clean logic here.