Uncaught TypeError: Cannot read property 'length' of undefined while loading child grid URL in offline

[Fazle Rabbi Tanjil]

When  I added the a child grid to a Grid make it offline(false) then i get the following error. Please remeber that if i set offline(true) it preloads all data correctly in the grid.

@(Html.EJ().Grid<emp.Models.ProjectTaskModel>

        ("SessionGrid")

                .Datasource(ds => ds.Json((IEnumerable<object>)ViewBag.dataSource)

                .InsertURL("../../../" + ViewBag.EventID + "/Session/NormalInsert")

                .RemoveURL("../../../" + ViewBag.EventID + "/Session/InlineDelete")

                .UpdateURL("../../../" + ViewBag.EventID + "/Session/InlineUpdate")

                .Adaptor(AdaptorType.RemoteSaveAdaptor))

                ///.AllowGrouping()

                .AllowSorting(true)

                .AllowFiltering()

                .AllowTextWrap(true)

                .FilterSettings(filter => filter.FilterType(FilterType.Excel))

                .EditSettings(edit =>

                {

                    edit

                    .AllowAdding().AllowDeleting().AllowEditing().AllowEditOnDblClick(true)//.ShowDeleteConfirmDialog(true)

                    .EditMode(EditMode.DialogTemplate).DialogEditorTemplateID("#templateSession");

                })

            .ToolbarSettings(toolbar =>

            {

                toolbar.ShowToolbar().ToolbarItems(items =>

                {

                    items.AddTool(ToolBarItems.Add);

                    items.AddTool(ToolBarItems.Edit);

                    items.AddTool(ToolBarItems.Delete);

                    items.AddTool(ToolBarItems.Update);

                    items.AddTool(ToolBarItems.Cancel);

                })

                .CustomToolbarItems(new List<object>() { new Syncfusion.JavaScript.Models.CustomToolbarItem() { TemplateID = "#expand-all" }, new Syncfusion.JavaScript.Models.CustomToolbarItem() { TemplateID = "#collapse-all" } });

                ;

            })

            .Columns(col =>

            {

                col.Field("pt_id").HeaderText("pt_id").IsPrimaryKey(true).Visible(false).Width(37).Add();

                //  col.Field("pt_sort_order").HeaderText("pt_sort_order").Visible(true).Width(57).Add();

                col.Field("pt_level").HeaderText("pt_level").IsPrimaryKey(true).Visible(false).Add();

                col.Field("sort_by_start_date").HeaderText("sort_by_start_date").Visible(false).Width(57).Add();

                col.Field("s_start_date").HeaderText("Start Date").TextAlign(TextAlign.Left).Width(37).AllowFiltering(false).AllowSorting(false)

                    .Format("{0:dd-MMM-yyyy HH:mm}").EditType(EditingType.DateTimePicker).Add();

                col.Field("s_end_date").HeaderText("End Date").TextAlign(TextAlign.Left).Width(37).AllowFiltering(false).AllowSorting(false)

                    .Format("{0:dd-MMM-yyyy HH:mm}").EditType(EditingType.DateTimePicker).Add();

                col.Field("pt_desc").HeaderText("Session Name").TextAlign(TextAlign.Left).Width(100).AllowEditing(true).TemplateID("#columnTemplate").AllowFiltering(false).AllowSorting(false)

                .ValidationRules(v=>v.AddRule("required", true)).

                Add();

                col.Field("pt_type_desc").HeaderText("Session Type").AllowEditing(false)

                    .DataSource((IEnumerable<object>)ViewData["DropDownSource1"])

                        .TextAlign(TextAlign.Center)

                        .EditType(EditingType.Dropdown)

                        .Width(30).AllowSorting(false).Add();

                col.HeaderText("").AllowFiltering(false).AllowSorting(false)

                    .Template("#templateSubSession")//.AllowSorting(false)

                    .Commands(command =>

                    {

                        command.Type("detail")

                            .ButtonOptions(new Syncfusion.JavaScript.Models.ButtonProperties()

                            {

                                Text = "",

                                Width = "40px",

                                Click = "onClick",

                                CssClass = "my-peolple-glyphicon glyphicon-user"

                            }).Add();

                        command.Type("subsession")

                           .ButtonOptions(new Syncfusion.JavaScript.Models.ButtonProperties()

                           {

                               Text = "",

                               Width = "30px",

                               Click = "addsubsession",

                               CssClass = "my-peolple-glyphicon glyphicon-bookmark"

                           }).Add();

                    })

                    .IsUnbound(true)

                    .TextAlign(TextAlign.Center)

                    .Width(25)

                    .Add();

            })

            .ChildGrid(d =>

            {

                d.Datasource(ds =>ds.URL("../../../"+ViewBag.EventID + "/Session/GetPtTeams/SSPKR~rCHAIR").Adaptor(AdaptorType.UrlAdaptor).Offline(false))

               .QueryString("pt_id")

               .AllowSorting(true).AllowSelection(false)

               .SortSettings(s =>s.SortedColumns(c => c.Field("last_name").Direction(SortOrder.Ascending).Add()))

               .RowTemplate("#rowDataTemplate")

               .Columns(col =>

               {

                   col.Field("org_id").HeaderText("org_id").Visible(false).Add();

                   col.Field("bp_id").HeaderText("bp_id").Visible(false).Add();

                   col.Field("pt_id").HeaderText("pt_id").IsPrimaryKey(true).Visible(false).Add();

                   col.Field("role_code").HeaderText("bp_id").Visible(false).Add();

                   col.Field("bp_name").HeaderText("bp_id").Visible(false).Add();

                   col.Field("is_primary").HeaderText("bp_id").Visible(false).Add();

                   col.Field("first_name").HeaderText("First Name").Visible(false).TextAlign(TextAlign.Center).Width(30).Add();

                   col.Field("last_name").HeaderText("Last Name").Visible(false).TextAlign(TextAlign.Center).Width(30).Add();

                   col.Field("role_desc").HeaderText("Role").Visible(false).TextAlign(TextAlign.Center).Width(30).Add();

               }).ClientSideEvents(childeve => childeve.DataBound("childDataBound"));

            }).SortSettings(sort =>

            {

                //sort.SortedColumns(col => col.Field("pt_sort_order").Direction(SortOrder.Ascending).Add());

                //      sort.SortedColumns(col => col.Field("sort_by_start_date").Direction(SortOrder.Ascending).Add());

            })

            .ClientSideEvents(eve =>

            {

                eve.DetailsExpand("detailsExpand");

                eve.ActionComplete("complete1");

                eve.RowSelected("rowSelected");

                eve.QueryCellInfo("queryCellInfo");

                eve.ToolbarClick("toolBarEvent1");

                eve.RecordDoubleClick("recordDoubleClick");

            })

)

@Html.EJ().ScriptManager()

Note that the child grid expand details correctly gets data from the server in valid format. But cannot render in the child grid.

[Seeni Sakthi Kumar Seeni Raj]

Hi Fazle,

We are able to reproduce issue at our end.

The reported issue will occur after returning datasource alone as a result and setting offline mode as false in ej.DataManager. While setting the offline mode as false in the URLAdaptor, the response from server should be wrapped in an object with properties named result to hold the data and count to hold the total records count. So we suggest to return the result and count pair as a result of method. Refer to the following code example.

        public ActionResult DataSource(DataManager dm)

        {

            int key = 0;

            var DataSource = OrderRepository.GetAllRecords();

                . . . . ..

            DataResult result = new DataResult();

            result.result = DataSource.Skip(dm.Skip).Take(dm.Take).ToList();

            result.count = DataSource.Count();

            return Json(result, JsonRequestBehavior.AllowGet);
        }

        public class DataResult

        {

            public IEnumerable result { get; set; }

            public int count { get; set; }
        }

We have prepared a sample that can be downloaded from the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/123537/ze/HierarchyURL-465991425

Regards,
Seeni Sakthi Kumar S.