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

Kendo Grid setDataSource does work properly if filterable or sortable options has been set.

2 Answers 577 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Weaveability
Top achievements
Rank 1
Weaveability asked on 05 Nov 2014, 11:34 AM
Hi there,  I have a grid that has been initialize at the beginning with no dataSource. What I wanted to achieve is to set / re-populate the DataSource to the grid later on.
I used the method setDataSource, but it doesn't work if the grid has initialized with the options "sortable" or "filterable". I have an example code below
$("#grid").kendoGrid({
  columns: [{
        field: "date",
        title: "Date",
        filterable: {
            cell: {
              enabled: true,
              showOperators: false,
              operator: "contains",
            }
          }
        },{
        field: "invoicenumber",
        title: "Invoice Number",
        filterable: {
          cell: {
            enabled: true,
            showOperators: false,
            operator: "contains",
          }
        }
      }             
  ],
  filterable: { mode: "row" },
  sortable:{ mode:"multiple", allowUnsort: true},
  scrollable: false
});
   
var grid = $('#grid').data("kendoGrid"), 
     
    dataSource = new kendo.data.DataSource({
      data:[
        { date : "26/09/2014", invoicenumber: "dsafasd"},
        { date : "11/11/2011", invoicenumber: "zzzzzz"}
      ]
        });
   
  grid.setDataSource(dataSource) ;
Any ideas?

2 Answers, 1 is accepted

Sort by
0
Weaveability
Top achievements
Rank 1
answered on 05 Nov 2014, 11:48 AM
Problem solved, instead of setting the sort and filter options at the beginning, I set them later right before calling setDataSource.

$("#grid").kendoGrid({
  columns: [{
        field: "date",
        title: "Date",
        filterable: {
            cell: {
              enabled: true,
              showOperators: false,
              operator: "contains",
            }
          }
        },{
        field: "invoicenumber",
        title: "Invoice Number",
        filterable: {
          cell: {
            enabled: true,
            showOperators: false,
            operator: "contains",
          }
        }
      }             
  ],
  dataSource: {},
  scrollable: false
});
   
var grid = $('#grid').data("kendoGrid"), 
     
    dataSource = new kendo.data.DataSource({
      data:[
        { date : "26/09/2014", invoicenumber: "dsafasd"},
        { date : "11/11/2011", invoicenumber: "zzzzzz"}
      ]
        });
 
    grid.setOptions({
        filterable: { mode: "row" },
        sortable:{ mode:"multiple", allowUnsort: true},
    });
 
    grid.setDataSource(dataSource) ;
0
Petur Subev
Telerik team
answered on 07 Nov 2014, 09:09 AM
Hello Jon,

The issue has been address and it is already fixed in our beta release / latest internal build. Another way to temporary fix it until you update is to pass object literal with the settings of the dataSource instead of instance of a DataSource.

e.g.

instead of
 
.kendoGrid({
       dataSource: new kendo.data.DataSource({
           //settings
       })
})
 
use
 
.kendoGrid({
       dataSource: {
           //settings
       }
})


Kind Regards,
Petur Subev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Weaveability
Top achievements
Rank 1
Answers by
Weaveability
Top achievements
Rank 1
Petur Subev
Telerik team
Share this question
or