+1-888-365-2779
Try Now
More in this section

Forums / Project Feather / Kendo UI Grid Integration With Widget Designers

Kendo UI Grid Integration With Widget Designers

2 posts, 1 answered
  1. Merritt
    Merritt avatar
    31 posts
    Registered:
    11 Mar 2011
    24 May 2015
    Link to this post

    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);

  2. Merritt
    Merritt avatar
    31 posts
    Registered:
    11 Mar 2011
    30 May 2015
    Link to this post
    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');

    Answered
2 posts, 1 answered