Error in ej.web.all.min.js refreshing subgrid data

[Juan Acosta]

Hi, 

I'm working with two grids, drag and drop between them. 

I selected the first element in the origin grid open a dialog with subgrid. Then I drag one register from origin to destination (subgrid). Until there everything is fine. 

Then I have a button to remove items in the grid. 

The error happen in the line 79 of _EditDetails.cshtml

function rowDoubleSelectVersion(args) {

        var data = args.data;

        var objGridLinked = $("#GridDocumentExpandVersions").ejGrid("instance");

        console.log('current items ' + objGridLinked.getCurrentViewData());

        var currentItemsGrid = objGridLinked.getCurrentViewData();

        console.log('current items size ' + currentItemsGrid.length);

        var newItemsGrid = _.remove(currentItemsGrid, { 'OrderID': data.OrderID });

        console.log('items available ' + currentItemsGrid.length);

        objGridLinked.dataSource(currentItemsGrid);

        objGridLinked.refreshContent();

    }

I click the button and remove the item. When I'm refreshing the item the grid throws the errors in  

Uncaught TypeError: Cannot read property 'items' of undefined(…)

_initColumns @ ej.web.all.min.js:10

addInitTemplate @ ej.web.all.min.js:10

refreshTemplate @ ej.web.all.min.js:10

refreshContent @ ej.web.all.min.js:10

_refreshDataSource @ ej.web.all.min.js:10

dataSource @ ej.web.all.min.js:10

confirmDeleteLinkedDocument @ DocumentDetails:1232

_trigger @ ej.web.all.min.js:10

_btnMouseClickEvent @ ej.web.all.min.js:10

dispatch @ jquery.js:4430

r.handle @ jquery.js:4116

I have attached a gif with the issue, an image and the project with the example.

Could you please take a look and let me know. I'm already had issues with the grid and I'm waiting for the release of update 4 next 30th. 

However, I'm not sure if this issue will be covered there.

Please only check the issue in the double click.

Kind regards,

Juan Acosta

Attachment: SyncfusionMvcApplication14_6718ac37.7z

[Karthick Kuppusamy]

Hi Codey, 

We have validated your reported issue and we suspect that using grid dataSource method . please find the screen shot. 

 

 

 

 

 

Now CurrentItemsGrid has one data. 

 

 

 

Now Grid data is removed from your code. So we suggest to use the condition as  

 

 

 

function rowDoubleSelectVersion(args) { 

        var data = args.data; 

        var objGridLinked = $("#GridDocumentExpandVersions").ejGrid("instance"); 

        console.log('current items ' + objGridLinked.getCurrentViewData()); 

        var currentItemsGrid = objGridLinked.getCurrentViewData(); 

        console.log('current items size ' + currentItemsGrid.length); 

        var newItemsGrid = _.remove(currentItemsGrid, { 'OrderID': data.OrderID }); 

        console.log('items available ' + currentItemsGrid.length); 

        if (currentItemsGrid.length>0) 

        objGridLinked.dataSource(currentItemsGrid); 

        objGridLinked.refreshContent(); 

    } 

 

Regards, 

K.Karthick. 

[Juan Acosta]

Hi Karthick,

I think you don't understand the situation, of course, if I test for the length more that 0, it will not call the refresh.

That's not the issue. The issue is I remove the item or any items and assign again the new list with the rest of items that weren't undeleted. And the grid should refresh showing the items available or any items at all if the grid is empty.

But the grid is simply breaking. Did you check the gif and the image of the error at all?

I will attach the error again. So, you can see the undefined error in the call to reassign the list of items. By the way, I did the same thing before assigning an empty list to the grid datasource with the result of a Get REST call and the grid does NOT break. That's what I know it is an issue.

Could you please transfer this ticket to Ramya Jayapandi or Ragavee US.  I had spoke with them about issues in the grid recently. So, I think they are more aware of this behaviour.

Kind regards,

Juan Acosta

Attachment: error_grid_again_648d986b.zip

[Madhu Sudhanan P]

Hi Juan, 

We have analyzed the rowDoubleSelectVersion function in which you have removed the item from currentViewData and updated new data using dataSource method. When removing items from currentViewData the internal count state will not be updated, hence the issue occurred. It`s not recommended to remove from currentViewData instead remove the items from grid`s dataSource property as follow. 

function rowDoubleSelectVersion(args) { 

        var data = args.data; 

        var objGridLinked = $("#GridDocumentExpandVersions").ejGrid("instance"); 

        console.log('current items ' + objGridLinked.getCurrentViewData()); 

        var currentItemsGrid = objGridLinked.model.dataSource; 

        console.log('current items size ' + currentItemsGrid.length); 

        var newItemsGrid = _.remove(currentItemsGrid, { 'OrderID': data.OrderID }); 

        console.log('items available ' + currentItemsGrid.length); 

        objGridLinked.dataSource(currentItemsGrid); 

        //objGridLinked.refreshContent(); 

    } 

Also we noted the usage of refreshContent method after dataSource method, it is not necessary to call refreshContent explicitly since the refresh will be handled by the dataSource method.  

Sample: https://www.syncfusion.com/downloads/support/forum/127078/ze/SyncfusionMvcApplication141167282797 

Please let us know if you have any queries. 

Regards, 

Madhu Sudhanan P 

[Juan Acosta]

Hi Madhu,

Thanks for all your help. That actually solve my issue. You are awesome.

Kind regards,

Juan

[Mohammed Farook J]

Hi Juan, 

  

We are happy to hear that your requirement is achieved. 

  

Regards, 

J. Mohammed Farook