Is there any way to use Spreadsheet and excel features with Datagrid UI

[Ayush Bajpai]

Hi, 

I want to use most of the spreadsheet features inside grid table. For example,

1. Copy a formula by dragging the fill handle.

2. Edit multi cell in batch.

3. While Start writing, get suggestions.

4. Extend the row and column size.

5. Context menu should have those feature which spreadsheet contains.(Including insert comment).

Is that possible to get those things in Data Grid?

Or Can we change spreadsheet UI to data grid?

I am attaching some screenshots with this forum, It might help to get some idea.

Thanks

Ayush Bajpai

[Rajapandi Ravi]

Hi Ayush,

Greetings from Syncfusion support

Query#: Copy a formula by dragging the fill handle.

In our Grid, the AutoFill Feature allows you to copy the data of selected cells and paste it to other cells by just dragging the autofill icon of the selected cells up to required cells. This feature is enabled by defining enableAutoFill property as true. Please refer the below documentation link for more information.

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/clipboard/#autofill

                              https://ej2.syncfusion.com/angular/documentation/grid/clipboard/#limitations-of-autofill

Query#: Edit multi cell in batch.

In our Grid, we are having batch editing feature. The batch Edit is work like MS Excel editing. In which you can edit only one cell at a time in the Grid. You can bulk save (added, changed and deleted data in the single request) to data source by click on the toolbar’s Update button or by externally invoking the batchSave method. To enable Batch edit, set the editSettings.mode as Batch.

Batch Edit: https://ej2.syncfusion.com/angular/documentation/grid/editing/batch-editing/

Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/grid/batch-editing

Query#: While Start writing, get suggestions.

From your query we could see that you like to get the suggestion while editing the cell, you can use the cell edit template feature of the Grid to render the AutoComplete component in the Grid edit form. Please refer the below documentation for more information.

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/editing/edit-types/#render-autocomplete-component-while-editing

Query#: Extend the row and column size.

You can change the row height by using rowHeight property of Grid and you can change the column size using Resizing feature of Grid. Please refer the below Sample demos and documentation for more information.

RowHeight sample demo: https://ej2.syncfusion.com/angular/demos/#/material/grid/row-height

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/row/row-height/

Resizing Sample demo: https://ej2.syncfusion.com/angular/demos/#/material/grid/column/column-resizing

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/columns/column-resizing/

Query#: Context menu should have those feature which spreadsheet contains.(Including insert comment).

The Grid has a contextmenu feature, you can right click anywhere on the Grid to view the context menu. The custom context menu items can be added by defining the contextMenuItems as a collection of contextMenuItemModel. Actions for this customized item can be defined in the contextMenuClick event. Please refer the below documentation link for more information.

Sample demos: https://ej2.syncfusion.com/angular/demos/#/material/grid/context-menu

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/context-menu/#custom-context-menu-items

Regards,

Rajapandi R