Remove entries in dropdown lists

5 posts, 1 answers
  1. David
    David avatar
    5 posts
    Member since:
    Aug 2015

    Posted 10 Nov 2015 Link to this post

    Hello Support Team,

    I implemented the scheduler in a mvc project with razor views.

    Whats the recommended way to remove entries from the dropdown lists on the editing form? For example: I'd like to remove the option "Yearly" in the "Repeat" dropdownlist and some options in the "repeat on" dropdownlist (day, weekday, weekend day). 

    Many thanks for your help.

    Regards,

    David

  2. Answer
    Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2190 posts

    Posted 11 Nov 2015 Link to this post

    Hello David,

    To achieve the desired behavior you should define custom editor template and adjust the options of the RecurrenceEditor:

    e.g.:
    @(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule)
        .HtmlAttributes(new { data_bind = "value:recurrenceRule" }))
        .Frequency(frequency => frequency
            .Add(RecurrenceEditorFrequency.Never)
            .Add(RecurrenceEditorFrequency.Daily)
            .Add(RecurrenceEditorFrequency.Weekly)
        )
    )


    Regards,
    Vladimir Iliev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Alain
    Alain avatar
    8 posts
    Member since:
    Mar 2012

    Posted 05 Sep in reply to Vladimir Iliev Link to this post

    I am using custom forms for edit/add loaded in partial views:

    ex:

    --------------------------------------------------------

    .kendoScheduler({

    add: eventAdd,

    (...)

    function eventAdd(e) {
                    // load the kendo window content
                    e.preventDefault();
                    console.log("add");               
                    // build the url
                    var url = '@Url.Action("Create", "Event")';         

                    // get the view, load content to kendo window
                    $.ajax({
                        type: 'GET',
                        url: url,
                        datatype: "html",
                        success: function (e) {

     wnd.setOptions({
                                (...)
                            });                       
                            //  set the window content
                            wnd.content(e);

    --------------------------------------------------------

    Now, in my view I am attempting to bind a recurrence editor to my model property, which always is blank on POST, and the ModelState also shows nothing.

    ---------------------------------------------------------

    @Html.LabelFor(model => model.RecurrenceRule, "Repeat Event", new { @class = "control-label input-sm" })
                        <div data-container-for="recurrenceRule" class="k-edit-field">
                            @(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule)
                                .HtmlAttributes(new { data_bind = "value:recurrenceRule", name = "recurrenceRule", data_role = "recurrenceeditor" }))
                            @Html.ValidationMessageFor(model => model.RecurrenceRule)                        
                        </div>

  4. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    594 posts

    Posted 07 Sep Link to this post

    Hi Alain,

    When preventing the default Scheduler editing behaviour, the RecurrenceRuleEditor would not update properly its value. Therefore, instead of preventing the edit and loading manually a Window with the edit fields, I would suggest you to use the Editable.TemplateName() configuration option of the MVC Scheduler:
    @(Html.Kendo().Scheduler<SliceIsNotaFunction.Models.SchedTasksModel>()
        .Name("scheduler")
        .Date(DateTime.Today)
        .Views(views =>
        {
    .......................
        })
        .Editable(e => e.TemplateName("EditTemplate"))
    ...........

    Then within the EditTemplate.cshtml you could define all the editors needed for your specific scenario. Attached you will find a simple project implementing the above suggestion.

    Alternatively, if you cannot avoid the manual definition of the edit Window, you will need to use a hidden field to keep the RecurrenceEditor value:
    <input type="hidden" name="RecurrenceRule" />
     
    <div class="k-edit-label">
        @(Html.LabelFor(model => model.RecurrenceRule))
    </div>
     
    <div data-container-for="recurrenceRule" class="k-edit-field">
        @(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule)
            .HtmlAttributes(new { data_bind = "value:recurrenceRule" })
        )
    </div>

    And on the Submit button click:
    $("#submitBtn").click(function (event) {
        var ruleEditor = $('[id="RecurrenceRule"]').getKendoRecurrenceEditor();
     
        if (ruleEditor) {
            var ruleValue = ruleEditor.value();
     
            $('input[name="RecurrenceRule"]').val(ruleValue);
        }
        $('form').submit();
    });

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Alain
    Alain avatar
    8 posts
    Member since:
    Mar 2012

    Posted 07 Sep in reply to Veselin Tsvetanov Link to this post

    Thank you.

     

    I got it working this morning by using a similar approach and using a hidden field, and on the Editor's change event, setting the value which is then passed to the controller.  The main reason I am using custom partial views is I am using a wizard-type popup with many form fields.

    <div class="col-md-8">
                        @Html.LabelFor(model => model.RecurrenceRule, "Repeat Event", new { @class = "control-label input-sm" })
                        @Html.HiddenFor(model => model.RecurrenceRule)
                       <div data-bind="value:recurrenceRule" id="recurrenceEditor" name="recurrenceRule"></div>                   
    </div>

    (...)

            $("#recurrenceEditor").kendoRecurrenceEditor({
                change: function () {                
                    $('#RecurrenceRule').val(this.value());
                }
            })

     

     

Back to Top