This is a migrated thread and some comments may be shown as answers.

angular-kendo hide Grid Header directives

2 Answers 52 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Zhonghai
Top achievements
Rank 1
Zhonghai asked on 06 Jun 2014, 06:28 AM
Hi there,

trying to hide the grid header completely (.k-grid-header) via a custom directive, but some how the k-grid-header is not available when the directive compiles. what could be the reason? and clues guys?

app.directive('ngHideGridHeader', function ($parse) {
    return function (scope, element, attrs) {
        $(element).find(".k-grid-header").hide();
    }
});
 
<div kendo-grid="grid" k-options="gridOptions" ng-hide-grid-header></div>

2 Answers, 1 is accepted

Sort by
0
Accepted
Mihai
Telerik team
answered on 06 Jun 2014, 09:09 AM
Hi,

That's like using a drilling machine to tighten a screw :-) but it should be possible.

First, the simple solution is to use CSS:

<style>
    /* or better, place it in a .css file that's loaded in your page */
    .hide-grid-header .k-grid-header {
        display: none;
    }
</style>

<div kendo-grid class="hide-grid-header" ...>

However, if you really want to use a directive: the reason why the widget is not there when your directive runs is that Angular-Kendo directives create widgets with a $timeout.  The following should work:

app.directive('ngHideGridHeader'function ($parse, $timeout) {
    return function (scope, element, attrs) {
           $timeout(function(){
            $(element).find(".k-grid-header").hide();
           });
    }
});

Hope this helps.

Regards,
Mihai
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Zhonghai
Top achievements
Rank 1
answered on 23 Jun 2014, 09:39 AM
Good morning Mihai,

sorry for the delayed confirmation and thanks for your reply. Yes, you are absolutely right, the CSS solution is much cleaner and better.

thanks

Zhonghai
Tags
Grid
Asked by
Zhonghai
Top achievements
Rank 1
Answers by
Mihai
Telerik team
Zhonghai
Top achievements
Rank 1
Share this question
or