Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Auto-initialize data table is not working using data-datatable="true" attribute in NextJs


Hi,

I am using Metronic Tailwind Css Version 9.1.2 in my NextJs application.

Problem:
Auto-initialize of data table is not working using data-datatable="true" attribute in NextJs, although the workaround i found is to use next/dynamic and manually initialize using const dataTable = new KTDataTable(tableElement, options); in useEffect hook. But I dont' want to use the next/dynamic, please tell how to Auto-initialize the data table using data-datatable="true" attribute in NextJs.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

Please refer to my previoise reply. Building next.js app on op on if th HTML/JS version of Metronic will be quite complicated since you will need to find workaround for variouse use cases. Instead we would suggest you to try our native next.js boilerplate that we will release next week.

Regards,
Sean



Hi Sean,

Thanks for your response. When are you releasing the native next.js boilerplate ? Waiting for it after your good news happy.



Hi happy,

Hopefully this week. A little bit left for the release.

Regards,
Sean


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(