We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

new grid record with next.js project

hi, i am trying to integrate grid syncfusion into a project with Next.js, my problem is that when the enter key is pressed to save a new record, an error is shown and the page restarts.

I attach links to reproduce the problem

Thank you

Francesco


https://stackblitz.com/edit/nextjs-qqbd7q?file=pages/index.js


3 Replies 1 reply marked as answer

RS Rajapandiyan Settu Syncfusion Team October 7, 2022 03:34 AM

Hi Francesco,


Thanks for contacting Syncfusion support.


By analyzing the provided sample, we found that you enabled the allowPaging property but didn’t inject the Page module. This is the cause of reported behavior. We suggest you to inject the Page module to resolve this.


Feature Modules: https://ej2.syncfusion.com/react/documentation/grid/module/


import {

  ColumnDirective,

  ColumnsDirective,

  GridComponent,

  Inject,

  Edit,

  Page,

  Toolbar,

} from '@syncfusion/ej2-react-grids';

 

export default class CategoryGrid extends React.Component {

  render() {

    return (

      <GridComponent

        toolbar={this.toolbarOptions}

        allowPaging={true}

        editSettings={this.editSettings}

        height={500}

      >

        <Inject services={[Toolbar, Edit, Page]} />

      </GridComponent>

    );

  }

}

 


sample: https://stackblitz.com/edit/nextjs-whptmh?file=pages%2Fcomponents%2Findex.js


Note: In EJ2 Grid, Editing feature requires a primary key column for CRUD operations. All the CRUD actions are performed based on the primary key only. So, we suggest you to set isPrimaryKey as true in any one of the unique columns. Refer to the below documentation for more information.


Grid-Edit: https://ej2.syncfusion.com/react/documentation/grid/editing/edit/

isPrimaryKey: https://ej2.syncfusion.com/react/documentation/api/grid/column/#isprimarykey


Please get back to us if you need further assistance.


Regards,

Rajapandiyan S
If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Marked as answer

FR Francesco October 9, 2022 02:16 AM

thank you so much!


it works perfectly



RS Rajapandiyan Settu Syncfusion Team October 10, 2022 01:53 AM

Hi Francesco,


We are happy to hear that you have achieved your requirement with the solution provided.


Please get back to us if you need further assistance.


Regards,

Rajapandiyan S


Loader.
Live Chat Icon For mobile
Up arrow icon