Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

DataTables warning: table id=kt_table_users - Incorrect column count.


Hi there! I'm currently using HTML as the foundation for my Laravel application, where I've implemented components to streamline my code. I've encountered an issue when trying to use fewer than 7 headers, resulting in an error. I'm looking for a solution to dynamically adjust the headers based on my code. Any guidance on where I can make these adjustments would be greatly appreciated.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (6)


Hi,

Could you please provide more info ? Which Metronic version and demo are you using?
What do you mean by "7 headers" ? What error did you get? Can you share screenshots via https://imgur.com?

Regards.



Here is the error

DataTables warning: table id=kt_table_users - Incorrect column count. For more information about this error, please see https://datatables.net/tn/18

Header == Columns. If i don't have 7 columns I get that error If i add or use fewer i get that error. When i put 7 columns everything works fine.

Edit: I tried it with 4 columns and that works fine. Im using laravel and components so all the code is standardized, so im baffled why 4 works 7 works but not 6.

right now im using 8.2.1 version demo1

https://imgur.com/a/nMRni9N



Hi,

Please try to check the datatable initialization code and make sure the config matches the column number.

If you need any further help please provide us your HTML and JS code via https://gist.github.com/

Then recompile your assets folder with Gulp or Webpack.

Please note that the build tools are required only in the development environment just to compile the assets when the source folder files are modified. In the hosting/server deployment, you will only need the compile assets, no need to install the build tools dependencies there.

Regards.



Hi,

The table you are using is initialized in /src/js/custom/apps/user-management/users/list/table.js.

If you modify the table columns number at the HTML level, you will need to make the required changes in the JS init code as well and recompile the modified JS files.

In the part of the code:


// Init datatable --- more info on datatables: https://datatables.net/manual/
datatable = $(table).DataTable({
"info": false,
"order": [],
"pageLength": 10,
"lengthChange": false,
"columnDefs": [
{ orderable: false, targets: 0 }, // Disable ordering on column 0 (checkbox)
{ orderable: false, targets: 6 }, // Disable ordering on column 6 (actions)
]
});


{ orderable: false, targets: 6 } part sets the last actions filed as non sortable. So if you have 8 columns then you should change the targets value to 7 and if you have less, let's say 6 columns, you should change it to 5.

To handle Metronic assets please check Quick Setup guide.

Whenever you modify the js code in the source folder /src/js/ you will need to recompile it and move the latest code into assets/js/ using <a href="https://preview.keenthemes.com/html/metronic/docs/getting-started/build/gulp">Gulp Tasks</a

Please note that the build tools are required only in the development environment just to compile the assets when the source folder files are modified. In the hosting/server deployment, you will only need the compile assets, no need to install the build tools dependencies there.

Regards.



well thats not going to fix it in this case, i tried to change that value in the JS source code and this doesnt allow for any dynamics and still gives same error. Plus again im not building any assets as this is for all intents and purposese a HTML layout. Thanks anyway ill figure out my own problem


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(