HOw to Get More Data When Scroll View Reaches End

6 posts, 0 answers
  1. Scott
    Scott avatar
    6 posts
    Member since:
    Dec 2011

    Posted 15 Nov 2013 Link to this post

    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.
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 19 Nov 2013 Link to this post

    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!
  3. Kendo UI is VS 2017 Ready
  4. Scott
    Scott avatar
    6 posts
    Member since:
    Dec 2011

    Posted 19 Nov 2013 Link to this post

    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
  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 20 Nov 2013 Link to this post

    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!
  6. Scott
    Scott avatar
    6 posts
    Member since:
    Dec 2011

    Posted 22 Nov 2013 Link to this post

    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.
  7. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 25 Nov 2013 Link to this post

    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!
Back to Top
Kendo UI is VS 2017 Ready