the Loading... Message in Grid when there is no data. ExtJs Grid

Question

In my application, when there are no records on DB, the json i am receiving is as below.

JSON Message: {"totalCount":0,"responseObject":[]}

But in the grid the Loading... mask is not going off. It says Loading even if there is no data as in the image below.

Please suggest me how to get rid of this when there is no data, i want to show the empty grid without this loading mask.

Answer 1

I think I may know what your problem is, because I had the same issue.

For me, the reason why the loading mask wouldn't resolve was not because there were no records, but because I was trying to select the first record in the grid when there WAS none.

This throws a javascript error that looks like this: "Uncaught TypeError: Cannot read property 'id' of undefined "

Because of this error, it stops other Ext javascript processes, and the mask never gets a chance to resolve.

So, to solve this problem, I would make sure that your Store's 'load' event handlers do not try to do things with records that do not exist in the grid. It worked for me.