ejgrid childgrid multiple parameters currentViewData is null

[Adam Murray]

Hi,

I am trying to use the Hierarchical Grid with multiple parameters. I have found a solution provided here in this forum that appears to work, as my controller is invoked, data is collected and returned. Problem is when grid is rendering an error is thrown "Cannot read property 'length' of undefined".

I have opened min.js to find that it seems the 'this.model.currentViewData' property is null and a call to it's length throws the exception. Is this on my end or a problem with syncfusion grid?

Here is my code:

var datamanager = ej.DataManager('/api/patients/visitgetdatapointcategories');

var query = ej.Query()

                          .addParams('visitId', visitId);

var promise = datamanager.executeQuery(query);

promise.done(function (e) {

var dmDataPoints = ej.DataManager('/api/patients/visitgetdatapoints');

                         

$('#pastVisitLabDataPointGrid').ejGrid({

dataSource: e.result,

allowGrouping: true,

allowSorting: true,

enableAltRow: true,

enableDropAreaAnimation: false,

allowTextWrap: false,

groupSettings: {

showDropArea: false

//groupedColumns: ["Description"]

},

//cssClass: "background-visit-status-7",

columns: [

{ field: "Category", headerText: 'Category', textAlign: ej.TextAlign.Right, width: 75 }

//{

// headerText: "",

// template: true,

// templateID: "#visitLabDataPointRowTemplate"

//}

],

childGrid: {

dataSource: dmDataPoints,

queryString: "EncounterDataCategoryId",

columns: [

{ field: "ItemName", headerText: "Data Point", width: 350 },

//{ field: "ItemValue", headerText: "Current Value", width: 150 },

//{ field: "CreatedDate", headerText: "Current Date", width: 80, textAlign: ej.TextAlign.Right }

//{

// headerText: "",

// template: true,

// templateID: "#visitLabDataPointChildRowTemplate"

//}

],

load: function (args) {

console.log("child grid load");

//onVisitLabDataPointChildGridLoad(args);

//console.log(args);

var visitId = this.model.parentDetails.parentRowData.VisitId;

var categoryId = this.model.parentDetails.parentRowData.EncounterDataCategoryId;

if (this.model.query == null) {

this.model.query = new ej.Query();

}

this.model.query.addParams("visitId", visitId)

.addParams("categoryId", categoryId);

}

}

});

                         }

My controller call:

[Route("api/patients/visitgetdatapoints")]

[LogApiActionFilter(EventName = "Get Visit Data Points")]

[HttpGet]

public IEnumerable<PatientVisitDataPoint> GetVisitDataPoints(DataManager dm, int visitId, int categoryId)

{

if (!User.Identity.IsAuthenticated)

return new List<PatientVisitDataPoint>();

return _patientVisitRepository.GetVisitLabDataPoints(visitId, categoryId);

}

The enumerable list is loaded with 5 records and all though I cannot show contents due to HIPAA, suffice to say the column ItemName is never null or blank and is a string.

e.g  ItemName "Total Fagerstrom Nicotine Tolerance Scale - Smokeless Tobacco" string

Thanks,

Adam

[Jayaprakash Kamaraj]

Hi Adam, 

Thank you for contacting Syncfusion support. 

We have analyzed your code example and found that you have missed to mention adaptor in Grid and also you have returned result itself in server side. This is the cause of issue. If you do not mention adaptor in the Grid, it will consider default adaptor as ODataAdaptor.  So, we suggest you to mention adaptor as WebApiAdaptor and also we need to return the data as `JSON` and the JSON object must contain `Items` and ‘Count’ pair. The ‘Items’ with dataSource as its value and one more property `Count` with the dataSource total records count as its value. Please refer to the following Help document, code example. 

 

https://help.syncfusion.com/js/grid/data-binding#webapi 

 

        

    $(function () { 

        var dataManager = ej.DataManager({ 

            url: "/api/Orders", 

            adaptor: new ej.WebApiAdaptor() 

        }); 

 

        $("#Grid").ejGrid({ 

            dataSource: dataManager, 

            allowPaging: true, 

            columns: ["OrderID", "EmployeeID", "CustomerID", "ShipCountry", "Freight"] 

        }); 

    }); 

     public object Get() 

        { 

            var queryString = HttpContext.Current.Request.QueryString; 

            int skip = Convert.ToInt32(queryString["$skip"]); 

            int take = Convert.ToInt32(queryString["$top"]); 

            var data = db.Orders.Skip(skip).Take(take).ToList(); 

            return new { Items = data.Skip(skip).Take(take), Count = data.Count() }; 

        } 

Regards, 

Jayaprakash K. 

 

[Adam Murray]

Amazing, it works!

Thanks!

[Jayaprakash Kamaraj]

Hi Adam, 

 

We are happy that the problem has been solved. 

 

Please get back to us if you need any further assistance.   

 

Regards, 

 

Jayaprakash K.