Kendo-angular: Grid: column orderIndex property is missing

[MaklaCof]

I'm submitting a...

• Suggestion for improvement

Current behavior

Grid column doesn't have input property for order.

What is the motivation or use case for changing the behaviour?

I want to set order. I think it would make sense, since grid columns (ColumnBase) has orderIndex which I use on columnReorder event.

Special when columns are created with ngFor.

[rusev]

orderIndex property is not part of the public API of the column. It is implementation detail, required by the column reordering feature. It is intentionally left undocumented in the column API.

columnReorder arguments provides information on old/new index of the column. You can use that index to re-order the columns collection used in the ngFor directive.

[MaklaCof]

I know that I can use columnReorder event. But why should I be forced to do it?
Problem is I have to recalculate all columns order before I send to server new columns order.

If I move column from 2 to 5 all columns greater then 5 needs to get increase in order. How can I know which columns? Wouldn't be a lot easier to just get all columns order from grid.

[rusev]

Currently the public API exposes the columnReorder event with the new state for a given column. We may consider exporting more details in the future, but for the time being our suggestion is to use the event and calculate the new order of columns if required.

[tecsined]

I think we this could be a great feature for the application. For instance my use case requires to reorder the columns dynamically so if the grid has something that column order index I could just set that to a variable and have the other of my columns dynamically applied to fix templates. Also I can allows to save grid custom configuration on columns order

[MaklaCof]

Basically we need PersistState of KendoUI for jQuery feature.

[ngiebel]

For whatever help it may be to others this is the official documentation on how to persist the settings https://www.telerik.com/kendo-angular-ui/components/grid/how-to/persist-state/. Note that it does seem to rely on and expose ColumnBase and orderIndex.

public saveGridSettings(grid: GridComponent): void {
   const columns = grid.columns;  //undocumented, returns QueryList<ColumnBase>

   const gridConfig = {
       state: this.grid1Settings.state,
       columnsConfig: columns.toArray().map(
           item => Object.keys(item)
               .filter(
                   propName => !propName.toLowerCase().includes('template')
               )
               .reduce((acc, curr) => ({...acc, ...{[curr]: item[curr]}}), <ColumnSettings> {});
              // ColumnSettings in the example has orderIndex as a property, it would be serialized out anyways
       )
   };

   this.persistingService.set('gridSettings', gridConfig);
}

[tsvetomir]

There are no plans to expose an input for column order at the moment. The existing read-only field will be listed on ColumnBase which is now included in the public API.

The recommended approach to apply the column order is by creating columns from metadata using ngFor, as in the Persist State example.

[vtachkov]

A proper solution would be useful for my organization. The recommended solution here does not work when using column templates and isn't very reusable. How would you recommend being able to save the grid state (at a minimum column order, width, hidden) while also supporting column templates in a application that can have potentially tens of different grid instances?

I've used Kendo UI in AngularJS and it was a much simpler process to save and restore the grid state when loading a page, but it seems to be much more unreasonably difficult with Kendo Angular. I am still learning the nuances with Angular, however, so I don't know how everything works yet.