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

Razor View - Creating Custom For for a Event

4 Answers 138 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
FireHolster
Top achievements
Rank 1
FireHolster asked on 20 Sep 2013, 07:56 PM
Hi - we are looking for the possibilities to see and use the Kendo UI..

how to define the Custom Template here


@(Html.Kendo().Scheduler<Kendo.Mvc.Examples.Models.Scheduler.Screening>()
.Name("scheduler")
.Date(new DateTime(2013, 6, 13))
.StartTime(new DateTime(2013, 6, 13, 10, 00, 00))
.EndTime(new DateTime(2013, 6, 13, 23, 00, 00))
.Height(600)
.AllDayEventTemplateId("customAllDayTemplate")
.Views(views =>
{
views.DayView();
views.AgendaView();
})
.BindTo(Model)
)

4 Answers, 1 is accepted

Sort by
0
Vladimir Iliev
Telerik team
answered on 24 Sep 2013, 12:13 PM
Hi Fire,

 
I'm not sure If I understand you correctly, however if you are looking for a way to define the "customAllDayTemplate" then you should create new "script" tag with "id" attribute equal to "customAllDayTemplate" and "type" attribute set to "x-kendo-template":

<script id="customAllDayTemplate" type="text/x-kendo-template">   
    Your template here
</script>
 
@(Html.Kendo().Scheduler<Kendo.Mvc.Examples.Models.Scheduler.Screening>()
    .Name("scheduler")
    .Date(new DateTime(2013, 6, 13))
    .StartTime(new DateTime(2013, 6, 13, 10, 00, 00))
    .EndTime(new DateTime(2013, 6, 13, 23, 00, 00))
    .Height(600)
    .AllDayEventTemplateId("customAllDayTemplate")
    .Views(views =>
    {
        views.DayView();
        views.AgendaView();
    })
    .BindTo(Model)
)


Kind Regards,
Vladimir Iliev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
FireHolster
Top achievements
Rank 1
answered on 24 Sep 2013, 03:48 PM
Hi Vladimir - I did give it a try but i am still seeing the default template. Can you please help?

 <script id="UpdateTemplate" type="text/x-kendo-template">
        <div>Reason Type: 
        # 
        for (var i = 0; i < resources.length; i++) { #
        #: resources[i].text #
        #}#
        </div>
        <div>Hours: </div>
        <div>Charge: </div>
        <div>Comment:</div>
        <div>Client</div>      
  </div>
    </script>

 @(Html.Kendo().Scheduler<CalendarControls_Telerik.Models.JMAvailabilityTaskModel>()
    .Name("JMAScheduler")
    .Date(new DateTime(2013, 6, 13))
    .StartTime(new DateTime(2013, 6, 13, 7, 00, 00))
    .Height(600)

    // Create your own editable template
    //.Editable(editable =>
    //{
    //    editable.TemplateId("UpdateTemplate");
    //})

    // Defines how a Task will look like
            //.EventTemplate(
            //    "<div>" +
            //    "<p>" +
            //    "Create your own Template" +
            //    "</p>" +
            //    "</div>")

    .AllDayEventTemplateId("UpdateTemplate")
   // .AllDaySlot(true)
    .Views(views =>
    {
        views.DayView();
        views.WeekView();
        views.MonthView(monthView => monthView.Selected(true));
    })
    .Timezone("Etc/UTC")
    .Resources(resource =>
    {
        resource.Add(m => m.ReasonId)
            .Title("Reason")
                           .DataTextField("Text")
                           .BindTo(new[] { 
                         new { Text = "John", Value = 1, Color = "#f8a398" } ,
                         new { Text = "Bob", Value = 2, Color = "#51a0ed" } ,
                         new { Text = "Dell", Value = 3, Color = "#56ca85" } 
                     });

                        resource.Add(m => m.managerId)
                            .Title("Owner")
                            .DataTextField("Text")
                            .DataValueField("Value")
                            .DataColorField("Color")
                            .BindTo(new[] { 
                         new { Text = "John", Value = 1, Color = "#f8a398" } ,
                         new { Text = "Bob", Value = 2, Color = "#51a0ed" } ,
                         new { Text = "Dell", Value = 3, Color = "#56ca85" } 
                     });
                    })
            //.DataSource(d => d
            //    .Model(m =>
            //    {
            //        m.Id(f => f.TaskID);
            //        m.Field(f => f.OwnerID).DefaultValue(1);
            //    })
            //    .Read("Read", "Scheduler")
            //    .Create("Create", "Scheduler")
            //    .Destroy("Destroy", "Scheduler")
            //    .Update("Update", "Scheduler")
            //    .Filter(filters =>
            //    {
            //        filters.Add(model => model.OwnerID).IsEqualTo(1).Or().IsEqualTo(2);
            //    })
    )


0
FireHolster
Top achievements
Rank 1
answered on 24 Sep 2013, 03:51 PM
There is another problem..it is showing mt template when i use the editable but not with the AllDayEventTemplateId

    //.Editable(editable =>
    //{
    //    editable.TemplateId("UpdateTemplate");
    //})

0
Vladimir Iliev
Telerik team
answered on 25 Sep 2013, 07:18 AM
Hi Fire,

 
I tried to reproduce the problem locally but to no avail – everything is working as expected on our side. Could you please provide runable project where the issue is reproduced? This would help us pinpoint the exact reason for this behavior.

Kind 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
FireHolster
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
FireHolster
Top achievements
Rank 1
Share this question
or