Pass date range selected in scheduler to controller

Hi.
I need to pass start and end dates selected in scheduler via url parameter or with viewmodel, when i choose in a dropdown menu.

I required this for recalculate de resources for the selected range.

The schedule uses datamanager and crud for data, and in Load method not access to the view, its returns only json data, and i dont modify sscheduler resources with viewbag .... In the same manner in Index... 


Thanks in advance




5 Replies

HB Hareesh Balasubramanian Syncfusion Team April 17, 2020 01:44 PM UTC

Hi Guilermo, 

Greetings from Syncfusion Support. 

We have validated the “I need to pass start and end dates selected in scheduler via url parameter or with viewmodel, when i choose in a dropdown menu” query at our end. And for that, we have prepared a CRUD sample to perform filtering based on the selected date range. In the below sample, LoadData will be called both on initial load (with the current view range values) and selecting the date range externally (with the selected range values).  
 
Code snippet: 
 
Index.cshtml file: 
<ejs-datepicker id="startDate" placeholder="Choose a Start Date"></ejs-datepicker> 
<ejs-datepicker id="endDate" placeholder="Choose a End Date"></ejs-datepicker> 
<ejs-button id="btn" content="Click" isPrimary="true"></ejs-button> 
 
<script type="text/javascript"> 
    document.getElementById("btn").addEventListener('click', function () { 
         var schObj = document.querySelector(".e-schedule").ej2_instances[0];  
        schObj.eventSettings.query = new ej.data.Query().addParams("CustomStart", document.querySelector('#startDate').ej2_instances[0].value).addParams("CustomEnd", document.querySelector('#endDate').ej2_instances[0].value);  
    }) 
</script> 

Controller.cs file
        [HttpPost] 
        public List<ScheduleEvent> LoadData([FromBody]Params param) 
        { 
            DateTime start = (param.CustomStart != new DateTime ()) ? param.CustomStart: param.StartDate; 
            DateTime end = (param.CustomEnd != new DateTime()) ? param.CustomEnd : param.EndDate; 
            return _context.ScheduleEvents.Where(app => (app.StartTime >= start && app.StartTime <= end) || (app.RecurrenceRule != null && app.RecurrenceRule != "")).ToList(); // Here filtering the events based on the start and end date value. 
        } 
 
        public class Params{ 
            public DateTime StartDate { getset; } 
            public DateTime EndDate { get; set; } 
            public DateTime CustomStart { get; set;  } 
            public DateTime CustomEnd { get; set; } 
        } 


And for further reference kindly refer the below UG link for adding additional parameters, 

Kindly try the above solution and revert us if you have any further assistance. 

Regards, 
Hareesh 



GU Guillermo April 17, 2020 05:02 PM UTC

Hello again.
Sorry for my bad explanation.

I need the dates of the scheduler in the same way as in LoadData, but in the Index method, to calculate the available resources according to date selected in scheduler.

In the LoadData method I don't have access to the ViewBag.....


Same this:

      public IActionResult Index(Params param)
        {
            DateTime startDate = (param.CustomStart != new DateTime()) ? param.CustomStart : param.StartDate;
            DateTime endDate = (param.CustomEnd != new DateTime()) ? param.CustomEnd : param.EndDate;

            List<RoomResource> rooms = GetRoomsAvailable(startDate, endDate);
            ViewBag.Rooms = rooms;
            
            // datasource for owner resources
            List<OwnerResource> owners = GetOwernsAvailable(startDate, endDate);
            ViewBag.Owners = owners;

            return View();
        }


Thanks again...


HB Hareesh Balasubramanian Syncfusion Team April 21, 2020 02:01 PM UTC

Hi Guilermo, 

Thanks for the update. 

We have validated your reported query that “I need the dates of the scheduler in the same way as in LoadData” at our end. We suspect that you need to pass the date range at the initial loading. But, at the initial loading, we can access only the scheduler’s selected date and once the scheduler has rendered we can access the rendered dates of the scheduler and pass the dates to the backed. 

If you have any other concerns please revert for further assistance. 

Regards, 
Hareesh 



GU Guillermo April 22, 2020 02:52 PM UTC

Hello again.

I am trying to send the dates according to your orientations in the OnActionComplete event of the Scheduler.

I can't get them to arrive in date format, the same way they arrive in the LoadData method.

I have tried to convert without success.




            function onActionComplete(args) {

                if (args.requestType === "viewNavigate" || args.requestType === 'dateNavigate') {

                    var scheduleObj = document.getElementById('scheduleAgenda').ej2_instances[0];

                    var selDate = scheduleObj.selectedDate;

                    var currentViewDates = scheduleObj.getCurrentViewDates()

                    var startDate = currentViewDates[0];

                    var endDate = currentViewDates[currentViewDates.length - 1];

                    console.log("onActionComplete: " + startDate);

                    console.log("onActionComplete: " + endDate);

                    console.log(Date.parse(selDate));


                    $.post("/Agenda/ChangeDateRange",

                            {

                                selDate: scheduleObj.selectedDate,

                                fechas: scheduleObj.getCurrentViewDates()

                            }

                    );

                }

            }






In controller obtain the dates in string format (not datetime..)

        private static ParamsRangoFechas prf = new ParamsRangoFechas();

        public class ParamsRangoFechas

        {

            public string selDate { get; set; }

            //public DateTime selDate { get; set; }

            public List fechas { get; set; }

        }


        [HttpPost]

        public void ChangeDateRange(ParamsRangoFechas p)

        {

            prf.selDate = p.selDate;

            prf.fechas = p.fechas;

        }


Suggest some way to convert it?


Thanks again...



HB Hareesh Balasubramanian Syncfusion Team April 23, 2020 12:22 PM UTC

Hi Guillermo, 

Thanks for the update. 

We have validated your shared code snippets at our end. We suspect that your requirement is to pass the Scheduler current dates to the server end while switching scheduler views, dates and for that we don’t need to pass the Schedular current dates in actionComplete event. We have modified our previously updated sample, in that when we switch the date/views of the Scheduler then the corresponding Scheduler current view dates have been passed to the LoadData method in the server end as a StartDate and EndDate fields. And the sample can be downloaded from the following link. 

Code snippet: 
        [HttpPost] 
        public List<ScheduleEvent> LoadData([FromBody]Params param) 
        { 
            //DateTime start = (param.CustomStart != new DateTime ()) ? param.CustomStart: param.StartDate; 
            //DateTime end = (param.CustomEnd != new DateTime()) ? param.CustomEnd : param.EndDate; 
            DateTime start = param.StartDate; 
            DateTime end = param.EndDate; 
            return _context.ScheduleEvents.Where(app => (app.StartTime >= start && app.StartTime <= end) || (app.RecurrenceRule != null && app.RecurrenceRule != "")).ToList(); // Here filtering the events based on the start and end date value. 
        } 
 
        public class Params 
        { 
            public DateTime StartDate { get; set; } 
            public DateTime EndDate { get; set; } 
            //public DateTime CustomStart { get; set; } 
            //public DateTime CustomEnd { get; set; } 
        } 


And for further reference, we have taken a video demo of the above sample and it can be downloaded from the below link, 

Kindly try the above sample and revert us if you have any further assistance. 

Regards, 
Hareesh 


Loader.
Up arrow icon