Unplanned
Last Updated: 13 Oct 2024 19:24 by Tony BenBrahim
Jérémy
Created on: 12 Sep 2023 07:09
Category: Grid
Type: Feature Request
10
Customizable Drag Hint for Grid Component's Built-in Row Reordering

Hi,

It will be a nice feature to have the ability to customize the drag hint of the built-in row reordering similar to the hintTemplate.

5 comments
Tony BenBrahim
Posted on: 13 Oct 2024 19:24

Update: You can customize the text that is displayed as follows:
1. create a custom row reorder service. In this case, I only want to display one column (functionalName) in the drag hint, not all columns (this would be cleaner if getDragRowPerElement and dragTarget were protected rather than private)

import {RowReorderService} from '@progress/kendo-angular-grid';
import {ColumnList} from '@progress/kendo-angular-grid/columns/column-list';
import {Injectable, RendererFactory2} from '@angular/core';

@Injectable(
{providedIn: 'root'}
)
export class AttributesListingRowReorderService extends RowReorderService {

constructor(rendererFactory: RendererFactory2) {
super(rendererFactory.createRenderer(null, null));
}

public override getDefaultHintText(_columns: ColumnList, data: any[]): string {
const draggedDragRow = (this as any).getDragRowPerElement((this as any).dragTarget, data);
const draggedDataItem = draggedDragRow?.dataItem;
return draggedDataItem.functionalName;
}
}

2. customize your component to add a reference to the grid, inject the custom row reorder service and assign the custom row reorder service to the grid (fragments of code shown below:

export class EntityAttributesListingComponent implements OnInit, OnDestroy, AfterViewInit {
attributesListingRowReorderService = inject(AttributesListingRowReorderService);
@ViewChild(GridComponent) grid!: GridComponent;

ngAfterViewInit(): void {
this.grid.rowReorderService = this.attributesListingRowReorderService;
}
...
}

Other aspects of the hint can be customized using the same approach.

Enjoy




 

Tony BenBrahim
Posted on: 13 Oct 2024 18:33
My drag hint template has a bunch of `[object object] and could really use this feature
ADMIN
Yanmario
Posted on: 04 Sep 2024 05:57

Hi Everyone,

Our team appreciates the feedback and will track the demand for the feature request for future implementation. The feature request does seem to get a good amount of votes and that is a good sight that something needs improvement or additional options.

Regards,
Yanmario
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Brian
Posted on: 28 Aug 2024 17:29

I voted, but also wanted to comment on this one. That drag hint can look absolutely awful depending on what you've got in the grid. It really needs to be customizable for instruction and/or content purposes. 

Thanks for listening...

 

Nicholas
Posted on: 17 May 2024 21:12

This would be massively useful for the row reordering feature. I currently have custom row templates for my draggable rows and the drag clue is a loosely formatted set of span elements with some of the row data in it.

 

I hope this gets some attention and priority!

 

Best,

 

Nick