The data disappears after the user sits idle for a few minutes. There is no expansion or collapse of the child grids.

We are using 

Hello Eric, 

I assume that your backend service is not publicly accessible, so Stackblitz would not be able to access it to display the data. You can Fork the original sample (Fork button at the top in Stackblitz) and apply your changes there, but make sure the backend service you use can be accessed externally.

I wasn’t able to replicate this in the previously shared Stackblitz sample when leaving it idle for a while. Let me know if you’ve been able to replicate it there and if so if it happens in a particular browser or environment.

If not, other than the data being different I don’t see much of a difference in the settings and the way the data is passed to the grid between your code snippets and the sample.

Could you share an example of what the json data returned from your service looks like for the parent and the child grid requests? Could you also check that there’s just one request for each, one for the parent when the page loads and  one when the child grid is first expanded.

Also are there any errors when the data disappears in your application?   

I’m looking forward to your reply. 

Regard,

Maya Kirova

Hello Eric, 

Please note that the response from the service is currently setup to map to a data object:

public getData(dataState?: IDataState): Observable<any[]> {

 return this.http.get(this.url).pipe(

 map((response: any) => response.data)

 );

 }

Since your data is currently not wrapped in any object you should remove this.

Otherwise you are biding to an non-existing object, hence the grid would have no data.

 Regards,

Maya Kirova

Hello Maya,

That example worked great. I realized I have to use Stackblitz in chrome rather than Edge. Now I am trying to adjust the example to work with a locally running Web API Project and am getting a Grid has no data message.

Here is the shape of the JSON data which takes about 1 minute and 19 seconds to return from the HTTP Get Request

[
   
   
    {
        "JobInfoID": 292,
        "JobNumber": "710417074 ",
        "JobName": "21-30 44th Drive",
        "ClientName": "Source Construction Inc",
        "StartDate": "2018-02-18T00:00:00",
        "Status": "Pending Assignment",
        "GrossBuildingArea": 0.0,
        "Total": 0.0,
        "Floors": [
            {
                "JobInfoFloorID": 916,
                "Sequence": 1,
                "FloorName": "Ground/ 1st",
                "Area": 13708,
                "StartDate": "0001-01-01T00:00:00",
                "LinearFootHandrail": 0,
                "ClearStoryHeight": "10'-4\"",
                "Days": 15,
                "LinearFootBeam": 202,
                "NoOfDrops": 0,
                "Shore": null
            }
        ]
    }

]

And here is the forked, saved Stackblitz update.

https://angular-tyjbmq-edepr4.stackblitz.io

Hello Maya,

That now shows the data instead of an empty grid but the child grid for JobInfoFloors repeats the first floor for every item in the sub array: