Passing Date from Scheduler into DropDownList datasource

[David]

I am retrieving the start date of my Scheduler like this:

function get_date() {
var scheduler = $("#scheduler").data("kendoScheduler");
var view = scheduler._selectedView;
var startDate = view._startDate;

return startDate;  
}

I am trying to pass that date via ajax in order to populate my dropdownlist:

$("#drpHall").kendoDropDownList({
            dataTextField: "hallname",
            dataValueField: "hallid",
            dataSource: {
                transport: {
                    read: {
                        url: "chart_functions.cfc?method=GetHalls&returnformat=json",
                        data : {
                            dt: get_date()
                        },
                        dataType: "Json"
,success : function(result) {

alert(JSON.stringify(result));
}
                    }
                }
                , pageSize:10
            },
            index: 0
        });

 

I am using the function get_date(), but the dropdownlist does not render when I do this.  If I replace it with a simple "new Date()" parameter instead, the control renders (but obviously using the wrong date).

What do I need to do to pass that scheduler date properly?

Thanks!

[Nencho]

Hello David,

In order to correctly pass the Date object to the server and convert it in DateTime object, you should use the toISOString() on the Date js object. Please consider the below implementation:

$("#drpHall").kendoDropDownList({
            dataTextField: "hallname",
            dataValueField: "hallid",
            dataSource: {
                transport: {
                    read: {
                        url: "chart_functions.cfc?method=GetHalls&returnformat=json",
                        data : {
                            dt: get_date().toISOString()
                        },
                        dataType: "Json"
,success : function(result) {

alert(JSON.stringify(result));
}
                    }
                }
                , pageSize:10
            },
            index: 0
        });

Regards,
Nencho
Telerik by Progress

[David]

I'm afraid this did not fix it.  

When I call get_date() 

I added this:

var dt = get_date();
d = dt.toString();

And I get this:

Thu Mar 02 2017 00:00:00 GMT-0500 (Eastern Standard Time)

Somehow this returned value does not work when I attach .toISOString() or if I put it inside new Date().

[Nencho]

Hello David,

Could you elaborate a bit more on the current implementation. You mentioned that you get Thu Mar 02 2017 00:00:00 GMT-0500 (Eastern Standard Time). Could you specify, where in the code you are  evaluating this value? In addition, do you use a DateTime parameter to receive the value in the controller as demonstrated below?

  public JsonResult GetHalls(DateTime? dt)
 {
         ........
}

It would be best, if you could provide us with a runnable example of your implementation, so we could inspect your entire and exact implementation and pin down the reason for the inability to pass the date to the controller.

Regards,
Nencho
Telerik by Progress

[David]

I was able to pass the date by moving some code into document.ready(), but one thing I noticed is that the scheduler date it is returning is the start date from BEFORE the change of date via the navigator buttons.

I have this code:

scheduler.bind("navigate", scheduler_navigate);

And then I have this:

function scheduler_navigate(e) {

    var d = get_date().toISOString();

}

Here is the get_date function:

function get_date() {
var scheduler = $("#scheduler").data("kendoScheduler");
var view = scheduler._selectedView;
var startDate = view._startDate;

return startDate;  
}

What do I need to do to get the NEW date after the calendar navigator change?  Thanks!

 

 

[Nencho]

Hello David,

Instead of using a private method (_startDate), I would suggest you to use the date method of the arguments of the navigate event. Please refer to the article, demonstrating an example of this:

http://docs.telerik.com/kendo-ui/api/javascript/ui/scheduler#events-navigate

The e.date should return the new navigation date. regardless of the selected view.

Regards,
Nencho
Telerik by Progress