Our blazing fast Grid component built with pure JavaScript


Post by agarcia »

Hi, support,
I'm starting a new React project, I'm using the Grid component using the React wrapper component like this

<BryntumGrid {...gridConfig} />

.

The example in the Bryntum docs is like that:

const grid = new Grid({
    features : {
        pdfExport : {
            exportServer : 'http://localhost:8080' // Required
        }
    }
})

// Opens popup allowing to customize export settings
grid.features.pdfExport.showExportDialog();

How Could I take the features of my Grid by Using the react wrapper?

Thanks in advance


Post by tasnim »

Yes, Sure.

Here is how you could achieve it

  1. Inside your component which has the BryntumGrid, define a variable with setting useRef to null
    const grid = useRef(null);
    
  2. Then set the feature in BryntumGrid
    <BryntumGrid
    	pdfExportFeature = {{
    		exportServer : 'http://localhost:8080'
    	}}
    />
    
  3. And this is the onclick function of the export button
    const onExport = useCallback(() => {
        grid.current.instance.features.pdfExport.showExportDialog();
    }, []);
    

That should be it to implement the pdfExport feature in React Bryntum Grid


Post Reply