Pager next, previous page actions don't affect treeView

[Vedad]

Hello, 

I have a strange situation where I instantiate TreeView and its Pager, but when I hit pager to switch to the page 2, for example, pager reacts, and changes page, description which items are displayed (13-14 of 14), but TreeView contents don't follow and first page remains displayed. Pager DataSource is set to pageSize:12.

Only thing that I do differently from your example is that I initially setDataSource to default empty data source, then on click event on the form, I use it again to set different data source.

I also tried setting data, total under schema manually, but no success.

Here is my code extract for instantiation and change..

function handleTemplateSelector() {
    var listView = $("#listView").data("kendoListView"); 
    var pagi = $("#pager").data("kendoPager");
    pagi.setDataSource(vm.getNewDatasource());
    listView.setDataSource(vm.getNewDatasource());
}

Any suggestions would be welcomed.

Thanks and regards,

Vedad

[Vedad]

I Apologize, This should have gone under ListView Section.

Can someone Please move it or close it. 

I am sorry for the mess.

[Vedad]

I found the solution. 

Apparently, setDataSource doesn't like to receive a function as parameter. It is interesting that dataSource produced by function is assigned properly to the both ListView and Pager, but for some reason interconnection between two is not working in this case.

I am not a 100% sure, but I have feeling that reason is that two function calls don't refer to the same dataSource.

Sorry for spamming but I just wanted to share solution if someone needs it. It would be great if you could put it to the proper branch.

 

Cheers and sorry once again.

Regards, Vedad

[Alex Hajigeorgieva]

Hi, Vedad,

We have moved the thread in the Kendo UI ListView as requested.

The Kendo UI ListView setDataSource() method expects a data source as a parameter:

https://docs.telerik.com/kendo-ui/api/javascript/ui/listview/methods/setdatasource

So, in theory, it should work in case a data source instance is returned from the function:

vm.getNewDatasource = function(){
  var ds = new kendo.data.DataSource({
     transport: {
      read: {
        url: "https://demos.telerik.com/kendo-ui/service/Products"
      }
    },
  });

  return ds;
}

I tested with this example and it works just fine:

listView.setDataSource(getDs());

https://dojo.telerik.com/@bubblemaster/useqeBen

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

[Vedad]

Hello Alex,

 

Thanks for your response. You are right in terms of having data source assigned as result of the function. But if you create a datasource directly within function, then it doesn't work.

Following Dojo displays issue: https://dojo.telerik.com/OGUtiYUY

However, I fixed issue by simply instantiating var DS = getDs(); and passing it to the setDataSource (DS).

Previous example don't work because although the same function is executed, it still creates two datasources, and there is no binding between pager and listView.

Thank you very much and best regards,

Vedad

[Alex Hajigeorgieva]

Hi, Vedad,

You are correct when the () function returns a new data source instance. This would not be the case if it returns a data source instance that is declared in the scope:

vm.ds = new kendo.data.DataSource({
  transport: {
    read: {
      url: "https://demos.telerik.com/kendo-ui/service/Products",
      dataType: "jsonp"
    }
  },
  pageSize: 21
});

vm.getDs = function(){
  return vm.ds;
}

In addition to that, the first data source is not bound to the pager - note that the pager reads there are 0 records initially. I would recommend using a data source instance for the pager initially and then changing it to another data source:

https://dojo.telerik.com/@bubblemaster/iSuLIFUx

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

[Vedad]

Hi Alex, thanks a lot for the answer.

What you described is the approach I eventually taken and it worked :). Only it took me a little to figure out "new" issue within the function. 

Thanks for your help and time.

Best regards,

Vedad