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

Style event border from event template

1 Answer 95 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Boris
Top achievements
Rank 1
Boris asked on 13 Nov 2015, 09:24 AM

Hello,

I wan to ask, if there is some way to style .k-event div according to a variable in event template. 

What I need to do for example is to make red border on events, that have attribude "conflict = true" like that:

 

 <script id="event-template" type="text/x-kendo-template">
    <div data-conflict="#:hasConflict#">
    </div>
</script>​

 Or get value of "hasConflict" as a class of event or something like this.

 

I made some workaround with JQuery, going trough each event, search for attribute and toggle class.

 

$(".k-event").each(function () {

        var conflict = true;
        var conflictDiv = $(this).find("div[data-conflict]");
        if ($conflictDiv.length >= 1) {
            conflict = $conglictDiv.first().attr("data-conflict");
        }

        if (conflict) {
            this.addClass("conflict");
        }
        else {
            this.removeClass("conflict");
        }
    });​

 

But it seems to much complicated and I'm afraid, that it can take lots of time, i we have lots of events on the sheduler, I'm looking for more system-like way, like setting event color as is described here: http://dojo.telerik.com/@D_Learning/iQuta/4.

 

Thanks fo any answer.

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Vladimir Iliev
Telerik team
answered on 16 Nov 2015, 12:22 PM
Hello Boris,

Basically the event template is wrapped in another "div" element with "k-event" class in order to make sure the events are always position correctly. The scheduler however currently does not support editing of this wrapper element other than extending the desired view in order to override it (demo of extending views can be found here). That why If creating custom view is not an option I would suggest to use the "dataBound" event of the Scheduler to apply the desired custom borders the same way as you did. 

Regards,
Vladimir Iliev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Scheduler
Asked by
Boris
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
Share this question
or