Question

我有一个大问题，我过去了2个小时。

我有这个DataTabe：

const tableauAjoutCandidat = $("#tableauAjoutCandidats").DataTable({
    select: "multi",
    searching: false,
    columns: [
        {
            name: "nomPrenom",
            title: "NOM Prénom",
            data: "nom"
        },
        {
            name: "dateNaissance",
            title: "Date de naissance",
            data: "datenaissance",
            render: function(data) {
                return moment(data, 'YYYY-MM-DD').format('DD/MM/YYYY');
            }
        },
        {
            name: "besoins",
            title: "Besoins",
            data: "besoins"
        },
        {
            name: "epr",
            title: "EPR",
            data: "epr",
            render: function(data) {
                if (data == false) {
                    return '<input class="checkboxEPR" type="checkbox" value="" />';
                } else {
                    return '<input class="checkboxEPR" type="checkbox" value="" checked />';
                }
            }
        },
        {
            name: "demande",
            title: "Demande",
            data: 'demande'
        }
    ],
    ajax: {
        url: Routing.generate("exercicepratique_candidats_potentiels", {epId: epId}),
        dataSrc: 'candidats'
    },
    columnDefs: [
        { targets: 1, "type": "date-euro" },
    ]
});

在此DataTabla中，最后一列“需求”包含TRUE或FALSE，并且我想进行过滤以在未选中复选框时只看到带有TRUE的行，并且查看所有行。

所以我尝试了很多事情。
首先，我尝试使用类似这样的过滤器：

tableauAjoutCandidat.column('demande:name').data().filter(function (value, index) {
    const checked = $('#filtreDemandeConvocationEP').is(':checked');
    if (!checked && value != true) {
        return false;
    }
    return true;
});

$('#filtreDemandeConvocationEP').on('change', function() {
    tableauAjoutCandidat.draw();
)};

但它根本不起作用...

然后我尝试通过搜索进行搜索，例如：

$('#filtreDemandeConvocationEP').on('change', function() {
    const checked = $('#filtreDemandeConvocationEP').is(':checked');
    if (!checked) {
        tableauAjoutCandidat.column('demande:name').search('true').draw();
    } else {
        tableauAjoutCandidat.column('demande:name').draw();
    }
});

但结果相同...

所以现在我不知道该怎么办...我希望有人可以帮助我。谢谢！

PS：对不起，我的英语，因为您看到的不是我的母语。

Answer 1

您是否尝试过启用搜索？我看到您设置了search = false。

根据他们的文档：请注意，如果您希望使用数据表的搜索功能，则必须保持 true

https://datatables.net/reference/option/searching

const tableauAjoutCandidat = $("#tableauAjoutCandidats").DataTable({
    select: "multi",
    searching: true,
    columns: [
        {
            name: "nomPrenom",
            title: "NOM Prénom",
            data: "nom"
        },
        {
            name: "dateNaissance",
            title: "Date de naissance",
            data: "datenaissance",
            render: function(data) {
                return moment(data, 'YYYY-MM-DD').format('DD/MM/YYYY');
            }
        },
        {
            name: "besoins",
            title: "Besoins",
            data: "besoins"
        },
        {
            name: "epr",
            title: "EPR",
            data: "epr",
            render: function(data) {
                if (data == false) {
                    return '<input class="checkboxEPR" type="checkbox" value="" />';
                } else {
                    return '<input class="checkboxEPR" type="checkbox" value="" checked />';
                }
            }
        },
        {
            name: "demande",
            title: "Demande",
            data: 'demande'
        }
    ],
    ajax: {
        url: Routing.generate("exercicepratique_candidats_potentiels", {epId: epId}),
        dataSrc: 'candidats'
    },
    columnDefs: [
        { targets: 1, "type": "date-euro" },
    ]
});

Answer 2

尝试更改搜索结果为真

"searching": true

使用列代替列。

tableauAjoutCandidat.columns(4).search('true').draw();

希望有帮助。

Answer 3

我找到答案了！

我的页面上还有另一个DataTable，并且上面有一个过滤器。该过滤器与第二个DataTable上的搜索选项冲突。
因此，我在过滤器中放入了if，使其可以在所需的数据表上正常工作。

我无法过滤或搜索

3 个答案: