We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Filtering appointments

Hi, I have a scheduler that returns unfiltered appointments. I'd like to filter them using a json method that I fetch with an ajax call after the click of a button.
I cannot figure it out.

<div id="schedule" class="waiting" >
    @(Html.EJ().Schedule("Schedule1")
      .Width("100%")
      .Height("650px")
      .AllowKeyboardNavigation(true)
      .Locale("en-US")
      .TimeMode(Syncfusion.JavaScript.TimeMode.Hour12)
      .EnableAppointmentNavigation(true)
      .IsResponsive(true)
       .TimeZone("UTC +02:00")
       .ContextMenuSettings(menu => menu.Enable(true).MenuItems(item => item.Cells(ViewBag.cell).Appointment(ViewBag.app)))
      .ContextMenuSettings(menu => menu.Enable(true))
    .CurrentView(CurrentView.Month).AllowDragDrop(true)
    .EnableLoadOnDemand(true)
    .ScheduleClientSideEvents(eve => eve.CellDoubleClick("onOpen"))
            .ScheduleClientSideEvents(eve => eve.AppointmentHover("recordDetails"))
                             .ScheduleClientSideEvents(eve => eve.CellHover("recordDetails"))
                .ScheduleClientSideEvents(eve => eve.CellClick("cell"))
                            .ScheduleClientSideEvents(eve => eve.AppointmentClick("onAppointmentClick"))
        .ScheduleClientSideEvents(eve => eve.MenuItemClick("onMenuItemClicked"))
                        .ScheduleClientSideEvents(eve => eve.BeforeContextMenuOpen("popCustomContextMenu"))//.AppointmentSettings(fields => fields.Datasource(ds => ds.URL("/Home/GetData").Adaptor(AdaptorType.UrlAdaptor))  
    .Id("Id")
    .Subject("Subject")
    .StartTime("StartTime")
    .EndTime("EndTime")
    .AllDay("AllDay")
    .Recurrence("Recurrence")
    .RecurrenceRule("RecurrenceRule"))
      .StartHour(0)
      .EndHour(12)
          .AppointmentTemplateId("#MyTemplate"))


 <script type="text/javascript">
        var showAll = ko.observable(1);
        var showApproved = ko.observable(0);
        var showPendingApproval = ko.observable(0);
        var showActive = ko.observable(0);
        var showArchived = ko.observable(0);
        

        var filtersuccess = function (e) {
            var dManager = ej.DataManager(e).executeLocal(ej.Query());
            var schObj = $("#Schedule1").data("ejSchedule");
            //schObj._dataManager = dManager;
            schObj.model.appointmentSettings.dataSource = dManager;
            var c= $("#Schedule1").ejSchedule();
            //$("#Schedule1").data(e);
            //var schedule = $("#Schedule1");
            //schedule.sendRefreshRequest();
            //Moday do it with viewbag
            debugger;
        }
        var errorHandler = function (e) {
            debugger;
        }
        var all_click = function (e) {
            showAll(1);
            showApproved(0);
            showPendingApproval(0);
            showActive(0);
            showArchived(0);
            var dataToSend = { all: showAll(), approved: showApproved(), active: showActive(), pendingApproval: showPendingApproval(), archived: showArchived() }
            Home.common.ajaxPost(dataToSend, "home/filter", filtersuccess, errorHandler);
        }
        var approved_click = function (e) {
            showAll(0);
            showApproved(1);
            showPendingApproval(0);
            var dataToSend = { all: showAll(), approved: showApproved(), active: showActive, pendingApproval: showPendingApproval(), archived: showArchived() }
            Home.common.ajaxPost(dataToSend, "home/filter", filtersuccess, errorHandler);

        }
        var pendingApproval_click = function (e) {
            showAll(0);
            showApproved(0);
            showPendingApproval(1);
            var dataToSend = { all: showAll(), approved: showApproved(), active: showActive, pendingApproval: showPendingApproval(), archived: showArchived() }
            Home.common.ajaxPost(dataToSend, "home/filter", filtersuccess, errorHandler);
        }
        var active_click = function (e) {
            showAll(0);
            showActive(1);
            showArchived(0);
            var dataToSend = { all: showAll(), approved: showApproved(), active: showActive, pendingApproval: showPendingApproval(), archived: showArchived() }
            Home.common.ajaxPost(dataToSend, "home/filter", filtersuccess, errorHandler);
        }
        var archived_click = function (e) {
            showAll(0);
            showActive(0);
            showArchived(1);
            var dataToSend = { all: showAll(), approved: showApproved(), active: showActive, pendingApproval: showPendingApproval(), archived: showArchived() }
            Home.common.ajaxPost(dataToSend, "home/filter", filtersuccess, errorHandler);
        }


    </script>


The method is as follows in my controller:

 public JsonResult Filter( int? all, int? approved,int? archived, int? pendingApproval,int active=0)
        {
           
            List<DataSource> data = new List<DataSource>();
            var campaignDomainService = new CampaignDomainService();
            var campaigns = campaignDomainService.GetCampaigns();
            if (all > 0)
            {
                approved = 0;
                archived = 0;
                active = 0;
                pendingApproval = 0;

            }
            if (approved > 0)
            {
                campaigns=campaigns.Where(e => e.ApprovedDate.HasValue);
            }
            if (archived > 0)
            {
                campaigns = campaigns.Where(e => e.Archived == true);
                active = 0;
            }
            if (active > 0)
            {
                campaigns = campaigns.Where(e => e.Archived == false || e.Archived == null);
            }
            if (pendingApproval > 0)
            {
                campaigns = campaigns.Where(e => e.ApprovedDate!=null);
            }

            foreach (var campaign in campaigns)
            {
                data.Add(new DataSource(campaign.CampaignId, campaign.CampaignName, campaign.CampaignName,
                    campaign.StartDate, campaign.EndDate, false, false));
            }

            ViewBag.dataSource = data;

            return Json(data, JsonRequestBehavior.AllowGet);
        }




The problem is, How do i then take "data" and set it as the new datasource? 



Attachment: Capture_c994c3b2.zip

1 Reply

KK Karthigeyan Krishnamurthi Syncfusion Team September 22, 2015 02:52 PM UTC

Hi Fanisa,

Thanks for contacting Syncfusion support.

We have prepared the sample to meet your requirement “Filtering appointments” , which can be downloaded from the following location. 

https://www.syncfusion.com/downloads/support/forum/120491/ze/Schedule_26cd5b3f-1211274046

In the above sample we had initially load the schedule control with some appointments. When the button “Load” is pressed  some appointments will be filtered via ajax post. Then the filtered appointments will be render in the schedule control.

Please let us know if you need any further assistance.


Regards,
Karthigeyan.


Loader.
Live Chat Icon For mobile
Up arrow icon