Usage of Components in a table column template

[Martin Butarbutar]

Hi,
The tableColumns array in my code defines the configuration for the columns of a table component. It specifies how each column of the table should behave, what data it should display, and how that data should be formatted or presented. Each object in the tableColumns array corresponds to a single column in the table, containing properties that control its appearance and functionality.
I would like to use a component as a template for text, which when clicked, pops up a modal.
is it possible to directly use a component in a template like in the case below?

Thanks in advance for your help

[Santhosh Iruthayaraj]

Hi Martin Butarbutar,

Greetings from Syncfusion Support.

In the React Grid component, you can use components as templates either by directly binding the function to the template or by returning the component’s JSX element from a function callback. For your reference, we have provided a code snippet and sample below

[index.js]

 

    {

      field: 'noFaktur',

      headerText: 'No. Faktur',

      width: 139,

      freeze: 'Left',

      isVisible: true,

      textAlign: 'Left',

      template: (data) => (

        <NomorFakturKeluaranTemplate open triggerSource="table" data={data} />

      ),

    }

 

Sample: https://stackblitz.com/edit/react-grid-qn3hcx-frr19q

Documentation: Column template in React Grid component | Syncfusion

Please let us know if you need any further assistance.

Regards,
Santhosh I