This is a migrated thread and some comments may be shown as answers.

HOw to Get More Data When Scroll View Reaches End

5 Answers 169 Views
ScrollView (Mobile)
This is a migrated thread and some comments may be shown as answers.
Scott
Top achievements
Rank 1
Scott asked on 16 Nov 2013, 04:07 AM
HI,

When the ScrollView reaches the end of the first data call, does it automatically call the datasource again or do I have to do something special to get that to work?

For example, I am making a call to a REST service that returns data in a JSON format. I want to bring back my data in chunks of 50 records and display those images. Once I get to the end of that data set, how do I make the Scroll View get the next set of data and continue to displaying the images while still being able to go back and look at the previous data/images?

If I need to pass in parameters to the REST service and those parameters change from data call to data call, how do I make sure that the parameter change is being passed on each data call?


Thanks.

5 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 19 Nov 2013, 12:03 PM
Hi Scott,

The widget (its DataSource) should automatically send request to the server for retrieving the new data set. In order to ensure smooth scrolling, a read request is being issues a little before the user reaches the last record.

In order the auto prefetch functionality to work as expected however, the server should provide the total number of records. For example - if there are 1000 records in total on the server, the read response should look contain:
{
    data: [{ .... }, { .... }],
    total: 1000
}

For more information please check the total API reference:
The DataSource automatically maintains request parameters - skip, total, pageSize, page and etc. In case you want to modify the existing or add new parameters to the request please use parameterMap function.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Scott
Top achievements
Rank 1
answered on 19 Nov 2013, 06:40 PM
Hi Alexander,

The Kendo UI mobile demos for the ScrollView, when binding to a remote data source, do not have the "total" value set as part of the data source configuration. They appear to continually call to the server with the "total" value not being set.

My application doesn't know the total number of records that will be brought back. How could it? That number will be changing over time and to set it to one value means that the server has to return that set amount of total records even if there may be more or less than the set value to return. My experience so far with playing with that value is that an error occurs when the expected "total" number of records is not returned.

I know I mentioned that I would be retrieving 50 records at a time. Is that what the "total" value should be set to so 50 records will be brought back at a time even though there will be more than that brought back from the server as the user scrolls through the images?


Thanks
0
Alexander Valchev
Telerik team
answered on 20 Nov 2013, 08:28 AM
Hi Scott,

Could you please specify to which demos you refer to? Both data binding examples available on demos.kendoui.com have specified total field.
schema: {
    data: "photos",
    total: "total_items"
}


I think you misunderstood what the total number represents. That is the number of records located in the data base, not the number of records that will be displayed on the client. And that number will update with each request. PageSize property indicates the size of a data chunk that will be received on the client. In most cases the total number is different from the page size value.

If the widget does not know the data total there is no way for it to determine when the last record is reached and respectively to prevent further scrolling.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Scott
Top achievements
Rank 1
answered on 22 Nov 2013, 04:28 PM
Hello again Alexander,

The "total" value is what I thought it was - the total records in the database. I was just making sure that it wasn't something else.

The two demos you mentioned are the ones I was referring to but I guess I overlooked the "total" value since it is set after data retrieval. Based on your first reply and some of the other demos for other widgets, I was thinking that property had to be hard coded so I was looking for a number and the demo I have set up does not have that property set.. Thanks for correcting me. 

From what I can tell in the Kendo demos, the json call is returning that total value and Kendo binds it to the data source. We can do that too.

I am assuming that I have to pass in variables to the data source query to get the next set of records as the Scroll View reaches the end of the current data chunk. For example, for the first call, I pass in something that says get  the first set of 50 records and for each subsequent call I increment by another 50 to be sure I get the correct set of records from the db.

So, does that mean I am correct in thinking that when the Scroll View reaches the end of the current set of records it is causing the data source to do another "read" and therefore another call to the database? And it is at the "read" point where I need to add my dynamic variables?


Thanks again.
0
Alexander Valchev
Telerik team
answered on 25 Nov 2013, 12:06 PM
Hello Scott,

Up to your questions:

So, does that mean I am correct in thinking that when the Scroll View reaches the end of the current set of records it is causing the data source to do another "read" and therefore another call to the database?

Yes, that is correct.

And it is at the "read" point where I need to add my dynamic variables?

You can add the variables at the parameterMap function of the DataSource's transport. The function is executed every time a DataSource is going to invoke another call to the database.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ScrollView (Mobile)
Asked by
Scott
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Scott
Top achievements
Rank 1
Share this question
or