TS ColumnDefs searchPanes not exists
TS ColumnDefs searchPanes not exists
kilo415
Posts: 15Questions: 3Answers: 1
TS: columnDefs: [ { .. searchPanes} <- not exists field ] (
How use searchPanes in columnDefs with TS ? Please help me
const table_skill = new DataTable(refTable?.current,
{
responsive: true,
data: skills,
columns: [
{
data: "id",
},
{
data: "name",
render: function (data: unknown, type: string)
{
if (type !== "display")
return data;
// return `<a href="skill?skill=${ data }"\
// > ` + data + `</ > `;
return "<a href='#!''>" + data + "</a >";
},
},
{
data: "description",
render: function (data: unknown, type: string)
{
if (type !== "display")
return data;
return "<p\
style='text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 400px;'\
> " + data + "</p > ";
},
},
{ data: "minLevel" },
{ data: "maxLevel" }
],
searchPanes:
{
viewCount: true,
collapse: true,
initCollapsed: true,
layout: "columns-2",
},
columnDefs: [
{
searchable: true,
className: css.highlight_standart,
targets: [1, 4],
},
{
searchable: false,
targets: [0, 2, 3]
}
],
layout: {
topStart: "pageLength",
topEnd: "search",
bottomStart: "info",
bottomEnd: "paging",
},
deferRender: false,
dom: "P<\"d-flex justify-content-between wrap mb-2\"lf>rt<\"d-flex justify-content-between wrap mt-2\"ip>",
scrollY: "400px",
});
<link rel="stylesheet" href="https://cdn.datatables.net/2.0.3/css/dataTables.dataTables.css" />
<!-- Addtional for datatables.net -->
<link rel="stylesheet" href="https://cdn.datatables.net/searchpanes/2.3.0/css/searchPanes.dataTables.css">
<link rel="stylesheet" href="https://cdn.datatables.net/select/2.0.0/css/select.dataTables.css">
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/3.0.0/css/responsive.bootstrap.css">
<link rel="stylesheet" href="https://cdn.datatables.net/responsive/3.0.0/css/responsive.dataTables.min.css">
import DataTable from "datatables.net";
import "datatables.net-searchpanes";
import "datatables.net-select";
Answers
And no filter by name
I don't see
searchPanesin your column definitions there, but you could potentially add "as any" after the object until the issue can be resolved properly.It would be really useful if you could create a test case showing the issue of Stackblitz or a minimal Git repo.
Allan
Problem solved,thanks
You need to create your own interface, which will contain all the necessary properties with the same types, for example, I solved it like this: