Change pop up editor fields for Scheduler

[Phil]

Hi there

I am looking at using the scheduler. I have a basic CRUD set up with it able to load data from the backend.
Currently the popup includes some fields I don't want (the "Repeat field"). I also want to add some additional fields to it.

 

Is it possible to customise the fields that appear within the popup. If I add "references" in the .net core they appear as dropdown or multi selects. But I have not found a way to specify what else should be visble/invisible.

I have a model that inherits from ISchedulerEvent

e.g

public class EventsSchedulerViewModel : ISchedulerEvent
    {
        public EventsSchedulerViewModel()
        {

        }

        public EventsSchedulerViewModel(
            long eventId,
            string title,
            string description,
            bool isAllday,
            string startTimeZone,
            string endTimeZone,
            string recurrenceRule,
            string recurrenceException,
            DateTime startDate,
            DateTime endDate,
            IEnumerable<int> events)
        {
            EventId = eventId;
            Title = title;
            Description = description;
            IsAllDay = isAllday;
            StartTimezone = startTimeZone;
            EndTimezone = endTimeZone;
            RecurrenceRule = recurrenceRule;
            RecurrenceException = recurrenceException;
            Start = startDate;
            End = endDate;
            Events = events;

        }

        public long EventId { get; set; }

        public string Title { get; set; }
        public string Description { get; set; }
        public bool IsAllDay { get; set; }
       

        public string StartTimezone { get; set; }
        public string EndTimezone { get; set; }
        public string RecurrenceRule { get; set; }
        public string RecurrenceException { get; set; }

        public bool NewField { get; set; } //New field to try and add a tick box to the popup
     
        private DateTime start;
        public DateTime Start
        {
            get
            {
                return start;
            }
            set
            {
                start = value.ToUniversalTime();
            }
        }

        private DateTime end;

        public DateTime End
        {
            get
            {
                return end;
            }
            set
            {
                end = value.ToUniversalTime();
            }
        }

        public IEnumerable<int> Events { get; set; }

    }

 

 

My guess is either there is some kind of attribute on the model to tell it to populate in the popup.

Or there is some kind of template I can use to then call on the RazorPage?

 

I was guessing adding a script for a template like:

 <script id="event-template" type="text/x-kendo-template">
        <div class="k-edit-label"><label for="title">Title</label></div>
        <div data-container-for="title" class="k-edit-field">
            <input type="text" class="k-textbox" name="title" required="required" data-bind="value:title">
        </div>
    </script>

and then in the razor doing something like 

.EventTemplateId("event-template")

Here is my View:

@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@Html.AntiForgeryToken()

@(Html.Kendo().Scheduler<FrameWow.Models.Events.Scheduler.EventsSchedulerViewModel>
    ()
    .Name("scheduler")
    .Date(DateTime.Today.Date)
    .StartTime(DateTime.Today)
    .ShowWorkHours(false)
    .Height(600)
    .Views(views =>
    {
    views.DayView();
    views.WeekView(weekView => weekView.Selected(true));
    views.MonthView();
    views.AgendaView();
    views.TimelineView();
    })
    .Timezone("Etc/UTC")
    .Resources(resource =>
    {
    resource.Add(m => m.EventId)
    .Title("Events")
    .DataTextField("Text")
    .DataValueField("Value")
    .DataColorField("Color")
    .BindTo(new[]
    {
    new { Text = "Room 1", Value = 1, Color = "#6eb3fa" },
    new { Text = "Room2", Value = 2, Color = "#f58a8a" }
    });
    resource.Add(m => m.Events)
    .Title("Events")
    //.Name("Events")
    .Multiple(true)
    .DataTextField("Text")
    .DataValueField("Value")
    .DataColorField("Color")
    .BindTo(new[]
    {
    new { Text = "Meeting 1", Value = 1, Color = "#f8a398" } ,
    new { Text = "Meeting 2", Value = 2, Color = "#51a0ed" } ,
    new { Text = "Meeting 3", Value = 3, Color = "#56ca85" }
    });
    })
    //.EventTemplateId("event-template")
    .DataSource(d => d
    .Model(m =>
    {
        m.Id(f => f.EventId);
        m.Field(f => f.Title).DefaultValue("No title");
        m.Field(f => f.Events).DefaultValue(1);
    })
    .Read(read => read.Url(Url.Page("Scheduler","ReadEventScheduler")).Data("additionalData").Type(HttpVerbs.Post))
    .Create(create => create.Url(Url.Page("Scheduler","CreateEventScheduler")).Data("additionalData").Type(HttpVerbs.Post))
    .Update(update => update.Url(Url.Page("Scheduler","UpdateEventScheduler")).Data("additionalData").Type(HttpVerbs.Post))
    .Destroy(destroy => destroy.Url(Url.Page("Scheduler","DeleteEventScheduler")).Data("additionalData").Type(HttpVerbs.Post))
    )
    )

I want to hide the "recurring" items and selection from the popup and add some of my own fields in. I have had a  look at the documentation around templates and couldn't find anything suggesting how to do this.

Any help to point me in the right direction would be appreciated.

Thanks

[Phil]

I have managed to find the syntax.

You can create a modal and give it a name within the shared ->EditorTemplates.

In the Scheduler you then have to do 

.Editable(editable => editable
    .TemplateName("EventSchedulePopUpEditor"))

This will then load the new modal you have created.

[Tsvetomir]

Indeed, it is correct that you could specify the editor template via the Editable option. However, regarding the scenario you first outlined with the script reference, you could make use of the TemplateId option and pass the name of a script block.

.Editable(e=>e.TemplateId("myTemplate"))