Add additional field to default edit template

7 posts, 0 answers
  1. Rasmus
    Rasmus avatar
    2 posts
    Member since:
    Aug 2015

    Posted 23 Aug 2015 Link to this post

    Hello,

     

    I'm a bit new to Kendo UI scheduler, replacing another calendar componenet with it. Now if I want to add an additional field to the edit event template like "isPrivate" how can I do this? Let's say I want to add it as a checkbox. I saw it is possible to add additional data with resources and have it show up in the popup, but only as select fields. Is there a way around or is the only option to make a complete custom template.?

     If I make a custom template, can I somehow use the recurring field from kendo?

     Best regards

    Rasmus

  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3747 posts

    Posted 25 Aug 2015 Link to this post

    Hello Rasmus,

    The best way to add an additional UI editor to the edit form is to define a standalone editor form. Thus you will gain full control over the editors and you can add/remove event fields. I would suggest you review the following how-to demo: Of course, if you would like to add only field and you think the effort of building custom editor form is not justified, then you can add the custom editor manually in the edit event of the widget. Here is a demo that shows this approach:
    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Eduardo
    Eduardo avatar
    7 posts
    Member since:
    May 2011

    Posted 25 Aug 2015 in reply to Georgi Krustev Link to this post

    I have add button (popup event) but I can set even for it...
  4. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3747 posts

    Posted 27 Aug 2015 Link to this post

    Hi eduardo,

    I am afraid that it is not clear what the described issue is. Could you elaborate a bit?

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Rasmus
    Rasmus avatar
    2 posts
    Member since:
    Aug 2015

    Posted 30 Aug 2015 in reply to Georgi Krustev Link to this post

    Exactly what I did, created a new custom template based on the link you provided. Thanks!
  6. blackout
    blackout avatar
    68 posts
    Member since:
    Feb 2020

    Posted 03 Apr in reply to Georgi Krustev Link to this post

    Hello Georgi,

    I'm replying on a post that you posted 25 Aug 2015.

    I added two checkboxes .. but i want to be able to read the value of it (true or false) and then in the update method do what i want to do with it.

    The Problem is when i click on ab event to edit it, and i change only the value of the new checkboxes .. it wo'nt fire an update. it closes the edit popup and that's it !

    Now event if edited another values, update will fires but there is no value from these two checkboxes ..

    Here is the Code :

    // Add Custom CheckBox and Label
                var newCheckBoxLabelVor = $('<div class="k-edit-label"><label for="Vorlauf">Vorlauf</label></div><div data-container-for="Vorlauf" class="k-edit-field"><input type="checkbox" name="Vorlauf" title="Vorlauf event" data-type="boolean" data-bind="checked:Vorlauf"></div>');
                var newCheckBoxLabelNach = $('<div class="k-edit-label"><label for="Nachlauf">Nachlauf</label></div><div data-container-for="Nachlauf" class="k-edit-field"><input type="checkbox" name="Nachlauf" title="Nachlauf event" data-type="boolean" data-bind="checked:Nachlauf"></div>');
     
                // Wire it's click event.
                //newCheckBoxVor.click(function (e) { alert("Checked"); });
     
                // Add CheckBox to the contrainer
                var AllDay_Container = e.container.find("div[data-container-for= isAllDay]");
                AllDay_Container.after(newCheckBoxLabelVor);
                var Vorlauf_Container = e.container.find("div[data-container-for= Vorlauf]");
                Vorlauf_Container.after(newCheckBoxLabelNach);

     

     

    So these Lines are in onEdit() function.

    and i added these two checkboxes to the SchedulerViewModel :

    public bool Vorlauf { get; set; }
    public bool Nachlauf { get; set; }

     

     

    and in the Update ActionMethod i wrote this :

    bool vorlaufBabe = eventVM.Vorlauf;
    bool NachlaufBabe = eventVM.Nachlauf;

     

    can you please help me  . . . . . .

  7. Ivan Danchev
    Admin
    Ivan Danchev avatar
    2063 posts

    Posted 07 Apr Link to this post

    Hello,

    I assume the code snippet below is from the "edit" event handler of the Scheduler. Instead of adding the checkboxes with jQuery try declaring them in the custom editor template. See this example: https://docs.telerik.com/kendo-ui/controls/scheduling/scheduler/how-to/editing/custom-edit-and-event-templates

    The Scheduler uses a template:

    editable: {
         template: $("#customEditorTemplate").html(),
    },
    Add the checkboxes to the template with id: customEditorTemplate

    Regards,
    Ivan Danchev
    Progress Telerik

    Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
    Our thoughts here at Progress are with those affected by the outbreak.
Back to Top