KendoUI Grid - фильтр не отображается

В моем приложении angular-kendo я вообще не могу отобразить фильтр сетки - даже значок фильтра, просто заголовки столбцов. Вот мой html:

<div ng-controller="IntroductionWizardCtrl">
        <h3 class="text-muted">Step 2: Select Application To Describe</h3>

    <div kendo-grid id="grid"
            k-data-source="dataSource"
            k-sortable="true"
            k-on-change="selectedItem = data"
            k-selectable="'row'"
            k-pageable='{ "refresh": true, "pageSizes": 5 }'
            k-filterable="true">
    </div>
    <div>
        <p>{{selectedItem}}</p>
    </div>
    <br/>
    <input type="submit" class="btn btn-primary" wz-next value="Proceed to Next Step"
           data-ng-click="" />
</div>

вот соответствующий контроллер Angular:

'use strict';

angular.module('wizardApp').controller('IntroductionWizardCtrl', ['$scope', '$location', '$rootScope',
    function ($scope, $location, $rootScope) {

        $scope.dataSource = {
            data: [{id: 1, name: "Account Underwriting - Misc App", bu: 50},
                {id: 2, name: "Achieve - Distributed", bu: 43},
                {id: 3, name: "ACT!", bu: 27},
                {id: 4, name: "Actuarial Database", bu: 29},
                {id: 5, name: "Adjustment Invoicing System (AIS)", bu: 34},
                {id: 6, name: "buncy Download", bu: 43},
                {id: 7, name: "Ariba", bu: 27},
                {id: 8, name: "Athena NY", bu: 29},
                {id: 9, name: "Authoria", bu: 34},
                {id: 10, name: "Avenue", bu: 43},
                {id: 11, name: "BC&IT - Services", bu: 27},
                {id: 12, name: "Billing Website", bu: 29},
                {id: 13, name: "Blue Butler", bu: 34},
                {id: 14, name: "BOE External", bu: 43},
                {id: 15, name: "Builders Risk", bu: 27},
                {id: 16, name: "Business Intelligence", bu: 29},
                {id: 17, name: "Care Center", bu: 34}],

                pageSize: 5, serverFiltering: true

        };
        $scope.rowSelected = function(e) {
            var grid = e.sender;
            var selectedRows = grid.select();
            for (var i = 0; i < selectedRows.length; i++) {
                $scope.selectedItem = grid.dataItem(selectedRows[i]);
                break;
            }
        };


        $scope.categoryDataSelectedRows=[];

        $scope.categoryData=
            {
        data:
            [{name: "General Application Information"},
            {name: "User Interface configuration description"},
            {name: "Application Architecture"},
            {name: "Database"},
            { name: "Backup & DR"},
            {name: "Design"},
            { name: "Operational data"},
            { name: "Testing"},
            {name: "Application Configuration details"},
            { name: "Application connectivity requirements"},
            {name: "Deployment Requirements"},
            {name: "Application dependencies"},
            {name: "Infrastructure dependencies"},
            { name: "Business value assessment"},
            { name: "Data requirements"},
            {name: "Hosting OS requirements"},
            { name: "License requirements"}], pageSize: 5
    }

        $scope.rowSelectedCategory = function(e) {
            var gridCategory = e.sender;
            var selectedRowsCategory = gridCategory.select();
            for (var i = 0; i < selectedRowsCategory.length; i++) {
                $scope.selectedItemCategory = gridCategory.dataItem(selectedRowsCategory[i]);
                break;
            }
        };
    }
]);

Я просмотрел много примеров, помимо Angular, где фильтрация в Kendo Grid работает просто отлично. Тем не менее, с угловым кендо у меня возникла эта проблема.


person Eugene Goldberg    schedule 01.04.2014    source источник
comment
Разве вы уже не задавали этот вопрос здесь? В любом случае, можете ли вы предоставить jsfiddle, который воспроизводит проблему?   -  person JohnnyHK    schedule 01.04.2014
comment
Никогда раньше не создавал скрипку. Вот мой первый ответ на эту проблему: jsfiddle.net/JLMWa/11   -  person Eugene Goldberg    schedule 01.04.2014
comment
Только что сделал обновление - удалил несколько вещей, чтобы сделать его более читабельным: jsfiddle.net/JLMWa/14   -  person Eugene Goldberg    schedule 01.04.2014
comment
Есть куча проблем с этим jsfiddle, которые появляются в консоли браузера. Вы можете исправить это?   -  person JohnnyHK    schedule 01.04.2014


Ответы (1)


Что ж, как оказалось, моя проблема была с порядком загрузки различных файлов css. bootstrap перезаписывал некоторые другие стили. Мне потребовалось некоторое время, чтобы разобраться с этим, но теперь моя сетка углового кендо в порядке. Спасибо за помощь!

person Eugene Goldberg    schedule 01.04.2014