Dynamic Databinding

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

    Posted 31 Aug 2015 Link to this post

    Hi,

    I need to bind the datasource to ASP.NET MVC Scheduler dynamically. In my scenario, I have 5 dropdownlists. Users will select item from the dropdownlists and then click Search buton and the scheduler will load the result. How can I do that with javascript? 

     

    Please see the attached image.

     

    @(Html.Kendo().Scheduler<TaskViewModel>()
        .Name("schedulerJob")
        .Date(new DateTime(2015, 8, 31))
        .StartTime(new DateTime(2015, 8, 31, 7, 00, 00))
        .Height(600)
        .Views(views =>
        {
            views.TimelineView();
        })
        .Timezone("Etc/UTC")
        .Group(group => group.Resources("Techs").Orientation(SchedulerGroupOrientation.Vertical))
        .Resources(resource =>
        {
            resource.Add(m => m.TechName)
                .Title("Techs")
                .Name("Techs")
                .DataTextField("emm_code")
                .DataValueField("emm_code")
                .DataSource(d => d.Read("Techs", "JOBS"));
        })
        .DataSource(d => d
            .Model(m =>
            {
                m.Id(r => r.emm_code);
            })
            .Read("JobSchedule_Read", "JOBS")
            .Create("JobSchedule_Create", "JOBS")
            .Update("JobSchedule_Update", "JOBS")
            .Destroy("JobSchedule_Delete", "JOBS")
        )
    )

     

      

    public JsonResult JobSchedule_Read([DataSourceRequest] DataSourceRequest request)
    {
        DateTime startDateTime;
        DateTime endDateTime;
        List<JscDet> JscDet = (List<JscDet>)Session["JobScheduleDateTime"];
        List<TaskViewModel> tasks = new List<TaskViewModel>();
     
        foreach (var item in JscDet)
        {
            startDateTime = SchedulerUtility.GetDateTimeFromSeconds(item.jsd_sch_date, item.jsd_sch_start_time);
            endDateTime = SchedulerUtility.GetDateTimeFromSeconds(item.jsd_sch_date, item.jsd_sch_end_time);
            tasks.Add(new TaskViewModel()
            {
                TaskID = item.jsd_jobno,
                TechName = item.jsd_sch_assto,
                emm_code = item.jsd_sch_assto,
                Title = "Job Title",
                Start = new DateTime(startDateTime.Year, startDateTime.Month, startDateTime.Day, startDateTime.Hour, startDateTime.Minute, startDateTime.Second),
                End = new DateTime(endDateTime.Year, endDateTime.Month, endDateTime.Day, endDateTime.Hour, endDateTime.Minute, endDateTime.Second),
                Description = "Description 101",
                IsAllDay = false
            });
        }
     
        return Json(tasks.ToDataSourceResult(request));
    }

    Thanks in advance

  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 02 Sep 2015 Link to this post

    Hello Kevork,

    I would suggest you check our "Basic Usage" demo. It shows how to build filter based on chosen people above the widget. Refer more specifically to the "change" handler attached to the checkboxes. The code uses Scheduler's dataSource to filter the result.

    Regards,
    Georgi Krustev
    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 02 Sep 2015 in reply to Georgi Krustev Link to this post

    Thanks for the reply.

    I have already used this filter to one of my another schedulers. This filter works in client side not in server side. But this time I need it in different way. I need to send the dropdownlist values to the Controller level and then build dataset and bind it to the schedule every time I click the search button. 

     

    Thanks in advance.

  5. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 04 Sep 2015 Link to this post

    Hello Kevork,

    thank you for the clarification. In this case, you will need to configure the widget to allow server filtering. You can find a way to do this following this "how-to" demo: Once the widget can perform server filtering, the approach described in the "Basic usage" demo will be applicable to your scenario.

    Let me know if something is not clear.

    Regards,
    Georgi Krustev
    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
  6. Kevork
    Kevork avatar
    39 posts
    Member since:
    May 2015

    Posted 24 Sep 2015 in reply to Georgi Krustev Link to this post

    I have solved this data binding from server side issue. Now it's working. Whenever I click the search button it requests for server side response and bind the data to the scheduler.

     

    @(Html.Kendo().Scheduler<TaskViewModel>()
        .Name("schedulerJob")
        .Date(new DateTime(System.DateTime.Today.Year, System.DateTime.Today.Month, System.DateTime.Today.Day))
        .StartTime(new DateTime(System.DateTime.Today.Year, System.DateTime.Today.Month, System.DateTime.Today.Day, 7, 00, 00))
        .Height(600)
        .Views(views =>
        {
            views.DayView();
            views.WeekView();
            views.TimelineView(v => v.Selected(true));
        })
        .Editable(e => e.TemplateId("scheduleEditorID"))
        .Timezone("Etc/UTC")
        .Group(group => group.Resources("Techs").Orientation(SchedulerGroupOrientation.Vertical))
        .Resources(resource =>
        {
            resource.Add(m => m.TechName)
                .Title("Techs")
                .Name("Techs")
                .DataTextField("emm_code")
                .DataValueField("emm_code")
                .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")
        )
    )

     

    $('#btnSearch').click(function () {
        var scheduler = $("#schedulerJob").data("kendoScheduler");
        scheduler.view(scheduler.view().name);
        $("#schedulerJob").data("kendoScheduler").resources[0].dataSource.read();
    })

     

    function passFilter() {
     
        var area = $("#areaDropDownList").data("kendoDropDownList").value();
        var dispatch = $("#dispatchDropDownList").data("kendoDropDownList").value();
     
        return {
            ip_area: area == "" ? "[All]" : area,
            ip_dispatch: dispatch == "" ? "[All]" : dispatch
        }
    }

     

            public JsonResult JobSchedule_Read([DataSourceRequest] DataSourceRequest request, string ip_area, string ip_dispatch)
            {
                List<TaskViewModel> tasks = new List<TaskViewModel>();
    ......
    ......
                return Json(tasks.ToDataSourceResult(request));
            }

Back to Top
UI for ASP.NET MVC is VS 2017 Ready