loadMore and grouped ListViews

2 posts, 0 answers
  1. Erik
    Erik avatar
    6 posts
    Member since:
    Aug 2012

    Posted 07 Sep 2012 Link to this post

    Hey there,

    I'm working on a messaging module that groups messages into date "categories," similar to something that you would find in Outlook Express (Today, Yesterday, Last Week etc...).

    The ListView works wonderfully with a grouped dataSource, but I'm having trouble putting it all together with a loadMore button. When the button is pressed the older messages are loaded just fine, but a new ListView header template is being rendered for the new items, even if they are within the same grouping as the previous items. This results in potentially having multiple headers for each grouping, defeating the purpose of the grouped data in the first place.

    Is there any way I can work around this and have the ListView items group themselves properly after pressing the loadMore button?

    Thanks for any advice you can give!

    - Erik
  2. Georgi Krustev
    Georgi Krustev avatar
    3725 posts

    Posted 10 Sep 2012 Link to this post

    Hi Erik,

    The "Load more" functionality, like the "Endless scrolling", makes request (if Ajax binding is used) for the next page. The DataSource of the ListView persists only the data returned from the last request. If the "Load more" functionality is used along with grouping then the newly loaded page will be grouped separately and appended to the end of the ListView. This is the expected behavior. If you need to avoid the multple headers then you need to refresh the ListView manually. Here I prepared a simple jsBin demo for you. Note that on every click the whole ListView is re-rendered.

    Georgi Krustev
    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