[CLOSED] CalendarPanel Remote Data

[T3rryChan]

Hi,

I have the following code to load the Events of the Calendar from the server side. For some reason, the events do not show on the calendar at all. Any help is appreciated.

View:

Html.X().CalendarPanel().Region(Region.Center).ActiveIndex(2).Border(false).CalendarStore(Html.X().CalendarStore().Calendars(calendars =>
                {
                    calendars.Add(new CalendarModel() { CalendarId = 1, Title = "Home"});
                    calendars.Add(new CalendarModel() { CalendarId = 2, Title = "Work" });
                    calendars.Add(new CalendarModel() { CalendarId = 3, Title = "School" });
                })).EventStore(Html.X().EventStore().Proxy(proxy => proxy.Add(Html.X().AjaxProxy().Url(Url.Action("GetEvents")).Json(true).Reader(reader => reader.Add(Html.X().JsonReader().Root("data"))))))

Action:

public JsonResult GetEvents()
        {
            var data = new EventModelCollection();
            
            data.Add(new EventModel()
                {
                    EventId = 1001,
                    CalendarId = 1,
                    Title = "Vocation",
                    StartDate = DateTime.Now.AddDays(-20).AddHours(10),
                    EndDate = DateTime.Now.AddDays(-10).AddHours(15),
                    IsAllDay = false,
                    Notes = "Have Fun"
                });
            data.Add(new EventModel()
            {
                EventId = 1002,
                CalendarId = 2,
                Title = "Lunch with Matt",
                StartDate = DateTime.Now.AddHours(11).AddMinutes(30),
                EndDate = DateTime.Now.AddHours(13),
                IsAllDay = false,
                Location = "Chuy's!",
                Url = "http://chuys.com",
                Notes = "Order the queso",
                Reminder = "15"
            });
            data.Add(new EventModel()
            {
                EventId = 1003,
                CalendarId = 3,
                Title = "Project Due",
                StartDate = DateTime.Now.AddHours(15),
                EndDate = DateTime.Now.AddHours(15),
                IsAllDay = false
            });

            return Json(data);
        }

[Vladimir]

Are you sure that Root("data") is correct?
As I know JsonResult returns data in 'result'
Try this
Root("result")

[T3rryChan]

Are you sure that Root("data") is correct?
As I know JsonResult returns data in 'result'
Try this
Root("result")

Still does not work, and here are some findings:

first, there is a javascript error on the page:

Uncaught TypeError: Cannot call method 'getTime' of null

second, GetEvents is not invoked

[Vladimir]

Please provide a test case

[T3rryChan]

1) create an empty ASP.NET MVC3 application (solution name is XNet), select Razor with the view engine

2) download Ext.Net package from NuGet then update the references of Ext.Net, Ext.Net.Utilities, Newtonsoft.Json, Transfrom.Net to the latest version

3) create a new controller under the "Controller" folder called HomeController.cs

4) create an Index function in HomeController.cs :

        public ActionResult Index()
        {
            return View();
        }

5) create a GetEvents() function in HomeController.cs as following:

public JsonResult GetEvents()
        {
            var data = new EventModelCollection();
            
            data.Add(new EventModel()
                {
                    EventId = 1001,
                    CalendarId = 1,
                    Title = "Vocation",
                    StartDate = DateTime.Now.AddDays(-20).AddHours(10),
                    EndDate = DateTime.Now.AddDays(-10).AddHours(15),
                    IsAllDay = false,
                    Notes = "Have Fun"
                });
            data.Add(new EventModel()
            {
                EventId = 1002,
                CalendarId = 2,
                Title = "Lunch with Matt",
                StartDate = DateTime.Now.AddHours(11).AddMinutes(30),
                EndDate = DateTime.Now.AddHours(13),
                IsAllDay = false,
                Location = "Chuy's!",
                Url = "http://chuys.com",
                Notes = "Order the queso",
                Reminder = "15"
            });
            data.Add(new EventModel()
            {
                EventId = 1003,
                CalendarId = 3,
                Title = "Project Due",
                StartDate = DateTime.Now.AddHours(15),
                EndDate = DateTime.Now.AddHours(15),
                IsAllDay = false
            });

            return Json(data, JsonRequestBehavior.AllowGet);
        }

6) create a view (index.csthml) in Views/Home like this:

@using Ext.Net
@using Ext.Net.MVC
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title>Cal</title>
</head>
<body>
@Html.X().ResourceManager().Namespace("CompanyX")

@Html.X().Viewport().Layout("Border").Items(items =>
{
    items.Add(Html.X().Panel().Region(Region.North).Height(53).Border(false));
    items.Add(Html.X().Panel().Layout("Border").Region(Region.Center).Items(pitems =>
        {
            pitems.Add(Html.X().Panel().Width(176).Region(Region.West).Items(wpitems =>
                {
                    wpitems.Add(Html.X().DatePicker().Listeners(listeners =>
                        {
                            listeners.Select.Fn = "CompanyX.setStartDate";
                            listeners.Select.Scope = "CompanyX";
                        }));
                }).TopBar(tbar => tbar.Add(Html.X().Toolbar().Items(tbaritems =>
                    {
                        tbaritems.Add(Html.X().Button().Text("Save All Events").Icon(Icon.Disk));
                }))));
            pitems.Add(Html.X().CalendarPanel().Region(Region.Center).ActiveIndex(2).Border(false).CalendarStore(Html.X().CalendarStore().Calendars(calendars =>
                {
                    calendars.Add(new CalendarModel() { CalendarId = 1, Title = "Home"});
                    calendars.Add(new CalendarModel() { CalendarId = 2, Title = "Work" });
                    calendars.Add(new CalendarModel() { CalendarId = 3, Title = "School" });
                })).EventStore(Html.X().EventStore().Proxy(proxy => proxy.Add(Html.X().AjaxProxy().Url(Url.Action("GetEvents")).Json(true).Reader(reader => reader.Add(Html.X().JsonReader().Root("data")))))));
        }));
})
</body>
</html>

7) Publish the website to local IIS (IIS 7)

8) launch the application with this URL http://localhost/XNet

[Daniil]

2) download Ext.Net package from NuGet then update the references of Ext.Net, Ext.Net.Utilities, Newtonsoft.Json, Transfrom.Net to the latest version

Please clarify is the issue reproducible with the latest Ext.NET from SVN?