hide an All day event with template

[Carlos]

Hello!!!

I'm using MVC Scheduler with a all day event template. 

<script id="event-template" type="text/x-kendo-template">
    #if(data.IsControl && hasControlElement(data)) {#
            #= title#
     #}else {#
    <div class="amagat">
    </div>
    #}#
</script>

I want to hide all the events with the template that contains <div class="amagat"/>

I've tried it by javascript and css, but no luck... 

<style>
    .k-event > .amagat {visibility: hidden ; display: none}
</style>

 

I've attached two images with the current result and the desired result.

 

Thanks!!

[Veselin Tsvetanov]

Hi Carlos,

As CSS does not offer to select a parent (in your case the k-event <div>), based on a condition in its children (in your case the class amagat), you won't be able to achieve the desired using pure CSS. Instead, you will have to manually change the styles of those parent elements using jQuery:

$('.k-event>.amagat').parent().css('visibility', 'hidden').css('display', 'none');

Regards,
Veselin Tsvetanov
Telerik by Progress

[Carlos]

Hello!!! Thanks for you answer!

But I don't have the expected result... it does nothing

where do I put it???

in the  $(document).ready(function () {})) ???

[Veselin Tsvetanov]

Hello Carlos,

You should call that function on the initial load of the widget, after the Scheduler content has already been rendered. You could do that in the $(document).ready(function(){....});. However, I would recommend you to use instead the dataBound() event of the Scheduler, which will be fired on each navigation / update / insert / remove executed on the Scheduler.

Regards,
Veselin Tsvetanov
Telerik by Progress