Data binding on 2nd visits to view

5 posts, 0 answers
  1. David
    David avatar
    13 posts
    Member since:
    Oct 2012

    Posted 30 Apr 2013 Link to this post

    Hello,

    I could use a bit of advice.

    I am working with a listview that has tiered sections. I can click on each branch in the tree to drill down to the next level. It looks like this: 
    $("#listview").kendoMobileListView({
        dataSource: data,
        template: kendo.template($("#exampleTemplate").html()),
        click: function (e) {
             // event to handle change in dataSource
             $("#listivew").data("kendoMobileListView").setDataSource(dataSource);
        }
    });
    This is working - the problem occurs if I revisit a view. If I click through the list, updating the dataSource and showing the new options, I can't go back and choose a different option. If I try, I am met with an "Uncaught TypeError: Cannot read property 'sectionId' of undefined". 

    It's a category list with sub-categories underneath. If I click Shoes > Sandals > Flip-Flops everything works, but if I try to go back and change from Flip-Flops to something else, I'm met with the TypeError.

    This tells me that the data isn't getting bound to the view when I go back (right?). I currently use onShow() to set up the dataSource. When using onBeforeShow() the list won't update with new data after the first time through, so going back and selecting Hiking Boots instead of Sandals will still show me the results for Sandals.

    Is there another method I could use to get this data to show up correctly on subsequent passes through the list?

    Thanks!
  2. Travis
    Travis avatar
    6 posts
    Member since:
    Mar 2013

    Posted 02 May 2013 Link to this post

    There are two references that should help. The first is a link to how heirarchies should be done with Kendo datasources and listviews:
    Hierarchy
    The second is a link to gotchas with kendo mobile, pay particular attention to the section on event order of beforeShow etc.
    Gotchas
    Lastly you may want to look at the Kendo Music Store example application use of MVVM and Require.js to simplify your code.
  3. Kendo UI is VS 2017 Ready
  4. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 02 May 2013 Link to this post

    Hi David,

    My guess is that you are re-initializing the mobile listview widget multiple times in a show event. Such approach is not supported. I would like to suggest that you examine this code library, which covers a scenario that seems quite similar to your case.

    Kind regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. David
    David avatar
    13 posts
    Member since:
    Oct 2012

    Posted 02 May 2013 Link to this post

    Thanks for the tips. 

    Are you saying that I cannot have hierarchy structure within one view? I'd like to just update the list to a sub-category on click. This is because some sub-categories have 5-6 categories beneath them, and so on. This is also a random amount for each category, so one sub-category may reach the end after one click, one might have 2-3 more clicks before the end.

    So I could have Shoes > Sandals > Flip-Flops (results) or Shoes > Boots > Work > Steel Toe > High Top (results)

    Because of this random hierarchy, and the fact that some have many sub-categories, I'd like to keep it all within one view that refreshes. That way I won't have to create a lot of views for each sub-category.

    Does that make sense?
  6. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 04 May 2013 Link to this post

    Hi David,

    Such scenario can be implemented - the listview items should navigate to the same view but with different parameters. The only trade-off is that the view transition won't be possible (as the view navigates to itself).

    Regards,
    Petyo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready