How to bind kendo grid data to scope variable in angularjs?

Question

I have following kendo grid in html:

<div #grid kendo-grid="kendoGrid" k-data-source="DataSource" k-resizable='true' k-scrollable='true' k-pageable='true' k-columns="gridColumns" k-editable="true" k-sortable="true" k-toolbar="toolBar" k-column-menu="true" k-filterable="true">

and following buttons defined as template in angular js controller:

this.$scope.toolBar = [
        {
            template: "<a class='k-button k-button-icontext' ng-click='saveEdits(data)')>Save Changes</a>"                                 
        },
        {
            name: "cancel"
        }
]

The saveEdits(data) is a method in the same angular js which I want to call on button click. What parameter to pass with this method that contains grid data?

score 0 · Accepted Answer · answered Dec 07 '16 at 07:46

After a lot of research, I found out that a scope variable in angularjs can be bound with kendo grid data with following syntax:

this.$scope.gridData = angular.element("#kendoGrid").data("kendoGrid").dataSource._data;

The scope variable gridData actually becomes array of rows of kendo grid, where each row is an array of columns(fields).

How to bind kendo grid data to scope variable in angularjs?

1 Answers1