reload Timeline Tree based on selected date

Scheduler ASP.NET MVC
#1

Hi,
I am considering the purchase of DHTMLX Scheduler for MVC, but first I need to figure out how I can load the tree in timelineview based on the selected date.

I tried with “onBeforeViewChange” event and windows.location.href:

scheduler.attachEvent(“onBeforeViewChange”, function (old_mode, old_date, mode, date) {
var formatFunc = scheduler.date.date_to_str("%Y%m%d");
window.location.href = “?date=” + formatFunc(date);
return true;
});

and within the controller:

DateTime selectedDate = ((this.Request.QueryString[“date”] == “”) || (this.Request.QueryString[“date”] == null)) ? DateTime.Today : DateTime.ParseExact(this.Request.QueryString[“date”], “yyyyMMdd”, CultureInfo.InvariantCulture);

With this mothod it works, but I reload the page and I have an annoying flash effect…

Is there a way to achieve this goal without reloading the whole page? (perhaps Partial View?)
Can I have a code example?

Thanks a lot
Mauro

#2

Hello,
you can load options via ajax.
During initialization sections of timeline can be specified as a named collection, so it could be changed by the client-side code later. Refering to this client-side methods:
docs.dhtmlx.com/scheduler/api__s … rlist.html
docs.dhtmlx.com/scheduler/api__s … ction.html

So, in the Controller you can init timeline following way:var line = new TimelineView("timeline", "section_id"); line.ServerList = "ajax_options";//set named collection, without initial values scheduler.Views.Add(line);

On the client side, you can load the sections via ajax and update the timeline sections (example uses jQuery for ajax request):[code] scheduler.attachEvent(“onBeforeViewChange”, function (old_mode, old_date, mode, date) {
var toStr = scheduler.date.date_to_str("%d-%m-%Y");
var start = scheduler.date[mode + “_start”](new Date(date));
var end = scheduler.date.add(start, 1, mode);

    //if scrolled date, or have switched from some other view to timeline
    if (mode == "timeline" && (old_date.valueOf() != date.valueOf() || old_mode != "timeline")) {
        $.ajax({
            dataType: "json",
            url: app.sections_url,
            data: {
                from: toStr(start),
                to: toStr(end)//stringify dates
            },
            complete: function (response) {

                var sections = JSON.parse(response.responseText);//return json array from the server
                //update named collection
                scheduler.updateCollection("ajax_options", sections);
            }

        });
    }
    return true;
});[/code]

Here is the complete example
s3.amazonaws.com/uploads.hipcha … Reload.zip