Angularjs Grid columns change are not effecting in kendo ui

1.1k views Asked by At

I am facing one issue related to using the kendo grid with two buttons .If i click on the first button it should show three columns and if I click on the second button, it should show only two columns. But it doesn't seem to be working .My current example is :

Reference Link

<div id="example" ng-app="KendoDemos">
  <div ng-controller="MyCtrl">
     <button ng-click="execute1($event)">Execute 1</button>
     <button ng-click="execute2($event)">Execute 2</button>
     <div kendo-grid="grid" k-options="gridOptions" k-rebind="selectedType"></div>
  </div>
</div>
1

There are 1 answers

2
Fabricio Duarte On

You had a simple error

In both cases you are using dataModel1, you have to use "dataModel2" for gridOptions2

var gridOptions2 = {
        dataSource: new kendo.data.DataSource({
            data: new kendo.data.ObservableArray(dataModel2),
          columns: [
                    { field: "Id", title:"ID", width: "56px" },
                    { field: "company", title:"company", width: "110px" },
                            { field: "os", title:"os", width: "110px" }
                   ]
        })

Here is resolved:

http://plnkr.co/edit/Nie7eJVoPmt6xUpnmqnF?p=preview

EDIT:

Now I undestand the problem:

You have this:

var gridOptions1 = {
        dataSource: new kendo.data.DataSource({
            data: new kendo.data.ObservableArray(dataModel1),
            columns: [
                    { field: "Id", title:"ID", width: "56px" },
                    { field: "company", title:"company", width: "110px" }

                   ]
        })
    };

But the "columns" should be outside of the DataSource, like this:

var gridOptions1 = {
        dataSource: new kendo.data.DataSource({
            data: new kendo.data.ObservableArray(dataModel1),

        }),
         columns: [
                    { field: "Id", title:"ID", width: "56px" },
                    { field: "company", title:"company", width: "110px" }

                   ]
    };

Here is working:

http://plnkr.co/edit/qQ2IzHSyGM7SsZxE3BEI?p=preview