如何在我的數據表 ajax 服務器端數據中添加下拉列表，以使用數據表列顯示到表中

Question

我是數據表 ajax 服務器端數據的新手，使用 php jquery Z27705A883ACE206. 我必須獲取數據，但現在我想在某些列中添加一個下拉列表以提交特定行的數據。

在名為“QA Status”的表格列中，我想為每一行添加一個下拉列表。

並且下拉選項是 1) 待定 2) 接受 3) 拒絕

看圖片

我想使用 jquery 數據表使用列添加下拉列表

這是我在表格中顯示數據的代碼

"columns": [
            {
              "render": function(data, type, full, meta) {
                return "";
              }
            },
            { "data": "created_at" },
            { "data": "campaign" },
            { data: null, render: function ( data, type, row ) {
                    return data.fname+' '+data.lname;
                } 
            },
            { "data": "c_name" },
            { "data": "qa_status" },
            { "data": "qa_resone" },
            { "data": "client_status" },
            { "data": "client_resone" },
            { "data": "score" }
        ]

在這段代碼中 { "data": "qa_status" } 我想顯示一個下拉列表，並且我還想在每行的最后一列中添加提交按鈕，以便在不重新加載頁面的情況下提交所選值。

請幫我。

Answer 1

嘗試添加以下內容，看看是否有效：

將以下代碼放入數據表選項中：

let data_table = $(".table_class").DataTables({

    columns: [
        ...
    ],

    initComplete: function() {
        this.api().columns().every(function() {
            var column = this;
            var select = $('<select style="width:100%;"><option value="">Select</option></select>')
                .appendTo($(column.footer()).empty())
                .on('change', function() {
                    var val = $.fn.dataTable.util.escapeRegex($(this).val());
                    column.search(val ? '^' + val + '$' : '', true, false).draw();
                });
            column.draw(false).data().unique().each(function(d, j) {
                select.append('<option value="' + d + '">' + d + '</option>')
            });
        });
    },

});