Kendo UI Grid Integration With Widget Designers

Posted by Community Admin on 24-May-2015 00:00

I'm super familiar with using kendo ui with angular, but your designers doesn't seem to work with the kendo grid directives at all. Here's a sample that doesn't work:

DesignerView.MyGrid.cshtml

<div kendo-grid

     k-data-source="gridData"

     k-columns="gridColumns"

     k-selectable="true"

     k-on-change="selected = data"></div>

and here's the angular module, designerview-mygrid.js :

(function ($)

//var designerModule = angular.module('designer', ['kendo.directives']);

var designerModule = angular.module('designer');

//This is basic controller for the "ManageItems" designer view.

designerModule.controller('MyGridCtrl', ['$scope', 'propertyService', function ($scope, propertyService)

$scope.feedback.showLoadingIndicator = true;

$scope.gridData = new kendo.data.ObservableArray([

artist: "Pink Floyd", track: "The dark side of the Moon" ,

artist: "The Beatles", track: "I've just seen a face" ,

artist: "Queen", track: "Innuendo"

]);

$scope.gridColumns = [

field: "artist", title: "Artist" ,

field: "track", title: "Track"

];

//Makes call to the controlPropertyService to get the properties for the widgets.

propertyService.get()

.then(function (data)

if (data)

$scope.properties = propertyService.toAssociativeArray(data.Items);

,

function (data)

$scope.feedback.showError = true;

if (data)

$scope.feedback.errorMessage = data.Detail;

)

.finally(function ()

$scope.feedback.showLoadingIndicator = false;

);

]);

)(jQuery);

Posted by Community Admin on 30-May-2015 00:00

Basically you'll need to push the kendo.directives into the module:

var customModule = angular.module("customModule", ["kendo.directives"]);

angular.module("designer").requires.push("customModule");

Or

var designerModule = angular.module('designer');

designerModule.requires.push('kendo.directives');

This thread is closed

All Replies