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

DataSource will not increment page

3 Answers 123 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Keith
Top achievements
Rank 1
Keith asked on 19 Sep 2013, 02:39 AM
I'm currently evaluating Kendo UI, and I've found a problem I can't get past. I can't manually update the page value on my datasource.

The code is very simple. When I click a button, I retrieve the value for page off the datasource for a combobox. I increment it by 1, and then I set the new value on the datasource. The problem is that it is not actually updating the page.

$(document).ready(function(){
    
    var MyDataSource, $MyComboBoxRef, $dataMyComboBox;
    
    MyDataSource = new kendo.data.DataSource({
        
        batch:true,
        serverFilter: true,
        serverPaging: true,
        pageSize: 10,
        schema: {
            total:"total",
            data: function(response){

                return response.options
            }
        },
        transport: {
            read: {
                dataType: "json",
                url: "/MyService",
                type: "POST",
                async: false,
                data: function(options) {
    
                    var MyComboBox = $("#MyComboBox").data("kendoComboBox"),
                        query = MyComboBox.text(),
                        $dataMyComboBox = $dataMyComboBox;

                    query = query == null || query == "" ? "*" : query;

                    return {
                        action:    "QueryMyComboBoxOptions",
                        query:   query,
                        page: options.page,
                        page_limit: options.pageSize
                    };
                }
            }        
        }
        
    });
    
    $MyComboBoxRef = $("#MyComboBox");
    $MyComboBoxRef.kendoComboBox({
        
        autoBind:false,
        minLength: 21,
        dataSource: MyDataSource,
        dataTextField: "text",
        dataValueField: "id"
    });
    
    $dataMyComboBox = $MyComboBoxRef.data("kendoComboBox");
    
    $('#submitBtn').click(function(){
        
        var page = $("#MyComboBox").data("kendoComboBox").dataSource.page();
        alert("Page: " + page);//Page: 1
        page = page +1;
        alert("Page: " + page);//Page: 2
        $("#MyComboBox").data("kendoComboBox").dataSource.page(page);//MyService is pinged, but page is passed back with a value of 1?
        page = $("#MyComboBox").data("kendoComboBox").dataSource.page();
        alert("Page: " + page);//Page: 1 .. ? Why isn't it updateing?'
    });
});

3 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 20 Sep 2013, 12:11 PM
Hello Keith,

First of all I would like to point out that the ComboBox does not support paging out of the box.

Regarding the issue with not updated page, I believe that the problem is related to the fact that the DataSource is not read at the time when you attempt to change the page (ComboBox has autoBind false).
As a result the total of the DataSource is not yet set which is why the component is not able to calculate its pages.

If you want to set the initial page, please consider using the page configuration option of the DataSource. 
MyDataSource = new kendo.data.DataSource({
        batch:true,
        serverFilter: true,
        serverPaging: true,
        pageSize: 10,
        page: 2

Once the data is received and the total count is set, you should be able to work directly with the page method.

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
Keith
Top achievements
Rank 1
answered on 24 Sep 2013, 11:08 PM
Since it is required that I have a combo box that has virtual scrolling, or something like it, I've ended up extending the base ComboBox, and adding the functionality I needed to meet requirements. It's working pretty well now, but I still ahve some questions concerning the answer you gave.

"I believe that the problem is related to the fact that the DataSource is not read at the time when you attempt to change the page (ComboBox has  autoBind false)."

I don't think that is true. The total may not be set the first time it tries to update, but the second time the result should have returned with the total, and so the second time I try to access it, it should work since the total is now set.

I'm thinking the problem may be that I'm not understanding how the total works. In the last plugin I used, the total meant the total results for that page. Then if the total was less than the pagSize, we would know that there were no more results. If the total was 0, we would not update the  data and we would not try to retrieve more results . But for the kendoComboBox, is the total actually the total number of results, regardless of page, that could be returned if I was retrieving all results at once (for the given search string)? So basically, the results of "SELECT COUNT(*) AS MYTOTAL FROM MYTABLE WHERE MYVALUE LIKE ? " ?.

0
Accepted
Alexander Valchev
Telerik team
answered on 26 Sep 2013, 04:17 PM
Hi Keith,

In Kendo, the 'total' means the total amount of records that are available on the server. This means that if you have, for example, 1000 records on the server and pageSize set to 20, the server response should be something like:
{
  data: [
    //20 records here
  ],
  total: 1000
}

If you want to set the page before data (and total) are retrieved from the server, please use the page configuration option of the DataSource.

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
Data Source
Asked by
Keith
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Keith
Top achievements
Rank 1
Share this question
or