SfListView Paging

[Jano]

Dear support,

I am trying to implement paging in a listview using mvvm pattern. I try to populate the pager after a button click event where I retrieve data from an API. I followed your help guidelines, but I can't seem to get it to work. The ObservableRangeCollection I use gets updated with the correct data, but in the helper class it stays at 0 items.

Could you possibly provide me with an example where paging is implemented using mvvm pattern where the data gets populated from an external API?

I look forward to hearing from you

Regards,

[Lakshmi Natarajan]

Hi Jano, 

 

Thank you for using Syncfusion products. 

 

We have checked the reported query “Could you possibly provide me with an example where paging is implemented using mvvm pattern where the data gets populated from an external API?” from our side. We would like to inform you that you can populate data from external API and load the SfListView using SfDataPager.  

 

We have prepared a sample to achieve your requirement and attached it to the following link, 

Sample: https://www.syncfusion.com/downloads/support/forum/165624/ze/PagingListView1573886404 

 

You can also refer to our online documentation regarding paging and web services in the following link, 

UG link: https://help.syncfusion.com/xamarin/listview/working-with-sflistview#paging 

KB link: https://www.syncfusion.com/kb/11932/how-to-bind-the-listview-data-using-restful-api-service-in-xamarin-forms-sflistview 

 

Please check our sample and let us know if this helps. 

 

Regards, 

Lakshmi Natarajan 

 

 

[Jano]

Hi Lakshmi,

Thank you so much for the response, Syncfusion support is always great. I did manage to get to get to a solution, but I will modify my work around to be more reliable like you suggested in the sample project.

Regards,

Jano

[Lakshmi Natarajan]

Hi Jano, 

 

Thank you for the update. 

 

We are glad that our solution meets your requirement. Please let us know if you need further assistance. As always, we are happy to help you out. 

 

Regards, 

Lakshmi Natarajan 

 

[Jano]

Hi Lakshmi,

I was able to implement the solution as you suggested. \i have however, run into another problem. The listview is populated according to user criteria, and I am experiencing some issues. When multiple API calls are made, the ondemandloading does not seem to work until you have clicked on the next page on the datapager.

Steps to reproduce:

• Add a new button to xaml to reset the observablerangecollection (outside the grid)
  

          <Button Text="New"
                        HorizontalOptions="End"
                        Command="{Binding New}"/>

• Place the "Populate data" button outside the grid
  

• Create a new command on the viewmodel

          public Command New { get; set; }

• Create the method for command and initialize in constructor in viewmodel

         public PagingViewModel()
        {
            PopulateList = new Command(OnPopulateLost);
            New = new Command(refresh); //new command
            DataServices = new RestService();
            this.OrderDetails = new ObservableRangeCollection<Orders>();
        }

         private void refresh(object obj) //this is to simulate clearing the listview for new items, and when no items are in the list
        {
            IsBusy = true;
            this.OrderDetails.Clear();
            CanShowList = true;
            IsBusy = false;
        }

• Click on the new button first, and then on the "Populate data" button.
• The listview will display an empty page, and ondemandloading only works after paging

I look forward to your reply, and thank you in advance.

Regards,

Jano

        

[Jano]

Dear support,

I did manage to solve the issue. I solved it by setting the pagecount of the datapager to 0, and loading the first page on the SizeChanged event, where after the onDemandLoading event works fine.

Regards,

Jano

[Ranjith Kumar Durairaj]

Hi Jano Moller

Thanks for the update. Really glad that your requirements are met.  Please let us know if you need further assistance, we will do the needful immediately.

Regards,
Ranjith kumar