New Metronic Docs!Added Integration Docs with Starter Kits Apps for Laravel, Laravel Livewire, Angular, Vue, Symfony, Blazor Server, Django & Flask & more
Browse Docs

KTDatatable


I am upgrading the theme from 9.1 to 9.2, but I am experiencing several problems with KTDatatable.
- In demo1 the tables use different classes than KTUI.
Example kt-card-footer -> kt-datatable-toolbar, flex... -> kt-datatable-length etc..
- How come the columns are always sortable even if I set the data-kt-datatable-column-sort to false?
- How can I set the default sort field on the data attribute/ts side?
- If I don't set a default sort in the request I have “null” and not null.
- Trying to sort the columns instead of the column name results in “true”.


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


I’ve faced similar issues when updating KTDatatable too, especially with sorting and attribute behavior. Sometimes it helps to check the data binding order or use the latest docs. jeenymods.com


Also, if anyone’s into modding or gaming tools, I recently checked out Jenny Mod
—Pretty cool stuff if you’re into Minecraft customization.



Hi

The KTUI v9.2 DataTable is uses new, more semantic classes (kt-datatable-*).
Update your table markup to use the new KTUI classes (kt-datatable-toolbar, kt-datatable-length, etc.) instead of the old ones.

For sort issues, we will fix it. The code does not check for data-kt-datatable-column-sort attribute before making a column sortable.

Thanks



KTImageInput also still does not work, I had already reported this months ago, the input value is always set to “”.


protected _change(): void {
const payload = { cancel: false };
this._fireEvent("change", payload);
this._dispatchEvent("change", payload);
if (payload.cancel === true) {
return;
}

const reader = new FileReader();

reader.onload = () => {
this._previewElement.style.backgroundImage = `url(${reader.result})`;
};

reader.readAsDataURL(this._inputElement.files[0]);
this._inputElement.value = "";
this._hiddenElement.value = "";
this._lastMode = "new";

this._element.classList.add("changed");
this._removeElement.classList.remove("hidden");
this._element.classList.remove("empty");

this._fireEvent("changed");
this._dispatchEvent("changed");
}



KTDataTable line 744

if (sortField !== undefined) {
queryParams.set("sortField", String(sortField));
}


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