search

shlomiassaf / ngrid

A angular grid for the enterprise
https://shlomiassaf.github.io/ngrid
MIT License
241 stars 40 forks source link

How to manually toggle a detailrow on/off? #166

Closed ahmed-habbachi closed 3 years ago

ahmed-habbachi commented 3 years ago

Please describe the feature you would like to request.

Manually / programmatically toggle a detailrow on/off

What is the use-case or motivation for this proposal?

I have a situation where i want to add a new record to the grid and I want to use the detailRow to fulfill the details. so my intention was to create an empty row via an external button and show the detail row to fulfill the details and then save the changes, the details contains more fields than the grid shows for the object.

Is there anything else we should know?

shlomiassaf commented 3 years ago

@Ahmed-Habbachi You need to get the instance of the detailRow plugin and then provide the row you want to toggle on/off.

To get the plugin instance:

const detailRowPlugin = PblNgridPluginController.findPlugin(gridInstance, 'detailRow');

And then, just toggle it:

detailRowPlugin.toggleDetailRow(row);

Where row is the data row to toggle (the actual data object)

Note that this only works for rendered rows, i.e. if virtual scroll is enabled only the visible rows can get toggled.

See a working example here:

https://codesandbox.io/s/ngrid-detail-row-programmatic-toggle-r2fcf?file=/src/app/app.component.ts:2150-2236