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

Proper documentation for DataTable is missing

The docs at https://keenthemes.com/metronic/tailwind/docs/components/datatable do not include enough information to work productively with KTDataTable using JS.

For example, I don't know what exactly the columns option expect as value, but TypeScript reports that columns is a required attribute when I pass in a config object.

Please create an extensible API documentation together with examples.

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 (6)


Hi David,

Please set stateSave: false in the config. This will reset the datatable state and use pageSize as the initial page size.

Thanks



Hello Faizal,

thank you. This solved the problem.



Hi David,

Does your datatable will work without columns in the config?

In /metronic-tailwind-html/src/core/components/datatable/types.ts, under interface KTDataTableConfigInterface

Try to add ? at the column to make it optional, like so:

columns?: { ....


If this work, we will include the fix the updates.

Thanks



Hello Faizal,

it seems not to work. When I set config to
{pageSize: 30} after having adjusted the type definition, it still shows 10 entries.



Hi David,

KTDataTableConfigInterface interface defines the configuration options you can provide when initializing a KTDataTable instance.

Please check file /src/app/datatables/allowed-ip-addresses.ts for the example datatable initialization codes using typescript.

Please let me know if you have any further questions.


Hello Faizal, thank your for your response.

I'm using Svelte with SvelteKit. The table rows are created in HTML and then a KTDataTable instance is created for this table.

I think I don't need the columns config because the data rows are created within the HTML section of my Svelte componen. But columns is a required attribute when I want to pass in a config for the KTDataTable. I want to define how columns are sorted, by defining config.sort.callback, but then my IDE reports that config.columns is required. What can I do?

Additional info: In SvelteKit, loading data is done on the component level. I therefore don't make use of the config attribute apiEndpoint.

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  :(