Metronic DataTables not working with new layout option
I am using the latest version of Metronic 8.2.5 with DataTables Bootstrap 5 styling. However Metronic does not seem to respect the new layout option provided by Datatables.
For example when I initialize my table with below code but Metronic always keeps it's own layout format with dom elems positioned at the bottom of the table.
return new DataTable("#tableId", {
layout: {
topStart: {
pageLength: {
menu: [10, 25, 50, 100]
}
},
topEnd: {
search: {
placeholder: "Type search here"
}
},
bottomEnd: {
paging: {
numbers: 3
}
}
}
});Replies (5)
I merely imagined it usually is a perception to write could possibly help anybody ended up being experiencing difficulity looking into nevertheless We are somewhat doubtful only are permitted to placed labels along with details in below.lab diamond wedding bandExceptional article, gone ahead of time along with added your blog. My spouse and i can’t delay you just read additional via anyone.lab made diamonds
Hi,
Can you disable or override the dom parameter in your Datatable js initialization code?
By default, Metronic uses it in the global datatable setup in src/js/vendors/plugins/datatables.init.js.
Regards.
Hi @Sean
Thanks for the reply. That would work but I want to avoid hacking the source files so for now I have used the old style dom positioning in my own custo js file.
options.dom =
"<"d-flex justify-content-between bg-light-primary px-3 py-2"" +
"<"d-flex align-items-center"l>" +
"<"d-flex align-items-center"B>" +
"<"d-flex align-items-center"f>" +
">" +
"<"table-responsive"tr>" +
"<"d-flex justify-content-between px-3"" +
"<"d-flex align-items-center"i>" +
"<"d-flex align-items-center"p>" +
">";I hope that Metronic updates their code base soon to respect datatables new layout options.
Thanks
Hi,
That's a great workaround. Sure, we will migrate those code parts in a future update.
Regards.
Hey Sean,
I was dealing the same issue for the last few days. I also upgraded to the latest version 8.2.6 today but still layout not working. Legacy dom works. Did you make the changes here? https://datatables.net/upgrade/2#dom-property
Is there any other missing feature for the datatables integration that we should know?
