Difference between treelist and grid

[BAOBAB]

When both perform the same action, the grid does not work.

treelist : https://dojo.telerik.com/ecIlIhOt/9
grid:  https://dojo.telerik.com/OnUZeMEc/7

action: run -> button1 click -> select Item -> button2 click

The tree list can be selected, but the grid cannot.

Why is that so? Thank you for your reply.

[Martin]

Hello, JunBeom,

When the Grid is reloaded the rows are also redrawn and new attributes are generated (including the UID). I would suggest using the persistSelection option of the Grid to preserve the selection when you set new data in the component.

Let me know if you have any further questions.

Regards,
Martin
Progress Telerik

[BAOBAB]

Thanks for your reply.

I applied it the way you suggested and it works well.

Another thing I'm curious about is why does treeList work differently than Grid?

[Neli]

Hi JunBeom,

The difference in the behavior is due to that the TreeList select method expects a dataItem as a parameter, while the Grid select method expects the rows as String|Element|jQuery. Here you will find the modified Dojo example where the Grid rows selection is persisted using the indexes - https://dojo.telerik.com/@NeliKondova/ALEVAXiN

Below you will find the modified code marked in yellow:

  $('#button2').on('click', function() {
        // 선택된 항목의 고유 식별자를 저장할 배열
        let selectedIds = [];    

        // 현재 선택된 항목의 고유 식별자를 저장
        let selectedRows = grid.select();
        selectedRows.each(function(index, element) {
          
          let dataItem = grid.dataItem(element);
          selectedIds.push($(element).index());      
        });
       

        // 데이터를 다시 로드한 후에 선택된 항목을 찾아 선택
        grid.dataSource.data(data);
        selectedIds.forEach(function(index) {
          let selectedRow = grid.table.find("tr:eq("+index+")");
          grid.select(selectedRow);
        });
      });

Regards,

Neli