Call Scheduler navigate method

4 posts, 0 answers
  1. Kevork
    Kevork avatar
    39 posts
    Member since:
    May 2015

    Posted 26 Jan Link to this post

    Hi,

     

    I need to call scheduler's navigate function when I click Search button. How can I do that?

    I wrote the following code for refreshing the scheduler but it sometimes works and sometimes not.

    $("#gridJobAllocation").data("kendoGrid").dataSource.read();

     

     Thanks.

  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 28 Jan Link to this post

    Hi Kevork,

    Could you please elaborate more on why do you need to trigger the "navigate" event? If you are trying to implement server filtering you can use the approach shown in the following demo:

    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. UI for ASP.NET MVC is VS 2017 Ready
  4. Kevork
    Kevork avatar
    39 posts
    Member since:
    May 2015

    Posted 03 Feb in reply to Vladimir Iliev Link to this post

    I need to show dynamic start and end time for 7 days a week. When the scheduler normally loads with the page, it doesn't show the dynamic start and end time. But when I choose date from the scheduler calendar, it works. That's why I need to call the  "schedulerJob_navigate" function on page loading event.

     

    function schedulerJob_navigate(e) {
        var startHour;
        var endHour;
     
        var companyInfo = @Html.Raw(Json.Encode(HttpContext.Current.Session["Level4CompanyObject"]));
     
        if(e.date.getDay() == 0){
            startHour = companyInfo.sys_start_time1;
            endHour = companyInfo.sys_end_time1;
        }
        else if(e.date.getDay() == 1){
            startHour = companyInfo.sys_start_time2;
            endHour = companyInfo.sys_end_time2;
        }
        else if(e.date.getDay() == 2){
            startHour = companyInfo.sys_start_time3;
            endHour = companyInfo.sys_end_time3;
        }
        else if(e.date.getDay() == 3){
            startHour = companyInfo.sys_start_time4;
            endHour = companyInfo.sys_end_time4;
        }
        else if(e.date.getDay() == 4){
            startHour = companyInfo.sys_start_time5;
            endHour = companyInfo.sys_end_time5;
        }
        else if(e.date.getDay() == 5){
            startHour = companyInfo.sys_start_time6;
            endHour = companyInfo.sys_end_time6;
        }
        else if(e.date.getDay() == 6){
            startHour = companyInfo.sys_start_time7;
            endHour = companyInfo.sys_end_time7;
        }
     
        $("#schedulerJob").data("kendoScheduler").options.workDayStart = startHour;
        $("#schedulerJob").data("kendoScheduler").options.workDayEnd = endHour;
    }

     

    @(Html.Kendo().Scheduler<TaskViewModel>()
        .Name("schedulerJob")
        .Date(DateTime.Today)
        .StartTime(0, 0, 0)
        .WorkDayStart(7, 0, 0)
        .WorkDayEnd(18, 0, 0)
        .Height(690)
        .EventTemplate("#if(ScheduleType == 'Reservation') {#" +
                        "<div class='reservationClass' style='float: left;'>" +
                            "<img src='calendar-icon-15.png' style='width:22px;' />" +
                            "#= ReservedBy # - #= title #" +
                        "</div>" +
                        "<div class='reservationClass' style='clear: both; float: left; padding-left: 22px;'>" +
                            "Reserved" +
                        "</div>" +
                        "#}" +
                        "else {#" +
                        "<div class='#= JobStatus #' scheduled='#= IsScheduled #' quote='#= IsQuote #' style='float: left; background-color: #= JobStatusColour # '>" +
                            "<img src='User-Group-Home.png' style='width:22px;' />" +
                                "#= title #" +
                        "</div>" +
                        "<div class='jobClass' style='clear: both; float: left; padding-left: 22px;'>" +
                            "#= description #" +
                        "</div>" +
                        "#}#")
        .Views(views =>
        {
            views.TimelineView(v => v.Selected(true));
        })
        .Events(e =>
        {
            e.Edit("schedulerJob_edit");
            e.Navigate("schedulerJob_navigate");
            e.Remove("schedulerJob_remove");
            e.Save("schedulerJob_save");
            e.DataBinding("schedulerJob_dataBinding");
            e.DataBound("schedulerJob_dataBound");
            e.MoveEnd("schedulerJob_moveend");
            e.ResizeEnd("schedulerJob_resizeend");
        })
        .Group(group => group.Resources("Techs").Orientation(SchedulerGroupOrientation.Vertical))
        .Resources(resource =>
        {
            resource.Add(m => m.TechName)
                .Title("Techs")
                .Name("Techs")
                .DataTextField("TechName")
                .DataValueField("emm_code")
                .DataColorField("Color")
                .DataSource(d => d.Read("Techs", "JOBS"));
        })
        .DataSource(d => d
            .Model(m =>
            {
                m.Id(r => r.emm_code);
            })
            .ServerOperation(true)
            .Read(r => r.Action("JobSchedule_Read", "JOBS").Data("passFilter"))
            .Create("JobSchedule_Create", "JOBS")
            .Update("JobSchedule_Update", "JOBS")
            .Destroy("JobSchedule_Delete", "JOBS")
        )
        .Editable(e =>
        {
            e.TemplateId("schedulerJobEditor").Window(w => w.Title("Time Slot Reservation").Name("schedulerJobEditor"));
        })
    )

     

     

    Thanks

  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 05 Feb Link to this post

    Hello Kevork,

    In current scenario you can execute the same code on the Scheduler only once, after it's initialization and reload the view as demonstrated below:

    //execute only once after the scheduler initialization
    $(function() {
      var scheduler = $("#scheduler").data("kendoScheduler");
      var view = scheduler.view();
      var date = scheduler.date();
      var startHour;
      var endHour;
     
      if (date.getDay() == 4) {
        startHour = companyInfo.sys_start_time4;
        endHour = companyInfo.sys_end_time4;
      }
     
      scheduler.options.workDayStart  = startHour;
      scheduler.options.workDayEnd = endHour;
     
      //refresh the view in order the changes to take effect
      scheduler.view(scheduler.view().name);
    });

    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
Back to Top
UI for ASP.NET MVC is VS 2017 Ready