datatables筛选单元格内容而不是db值

kcwpcxri 于 2021-06-18 发布在 Mysql

关注(0)|答案(1)|浏览(304)

使用datatables 1.10.19
我有一个mysql数据库，结构如下；

+------+-----------------+----------+----------+
| name | email           | status   | complete |    
+------+-----------------+----------+----------+
| Joe  | me@example.com  | 1        |1         |
+------+-----------------+----------+----------+
| Jim  | you@example.com | 1        |0         |
+------+-----------------+----------+----------+
| Sara | him@example.com | 0        |0         |
+------+-----------------+----------+----------+

我使用这个脚本从数据库中检索数据。
我的数据表过滤器在搜索 0 以及 1 ，但这会过滤两者 status 以及 complete 柱。我想搜索单词 active / inactive 以及 complete / incomplete 而不是 1 以及 0 .
我使用datatables columns.render选项根据行结果呈现这些列中的自定义输出。
我的数据表代码是；

$('#example').dataTable({
    "ajaxSource": "results.php", // output below
    "columns": [{
        "data": "name"
    }, {
        "data": "email"
    }, {
        "data": "status",
        "render": function(data, type, row, meta) {
            // row[2] returns an int of 0 or 1 from the db. inactive/active
            if (row[2] == 0) {
                return `inactive`;
            }
            if (row[2] == 1) {
                return `active`;
            }
        }
    }, {
        "data": "complete",
        "render": function(data, type, row, meta) {
            // row[2] returns an int of 0 or 1 from the db. incomplete/complete
            if (row[3] == 0) {
                return `incomplete`;
            }
            if (row[3] == 1) {
                return `complete`;
            }
        }
    }, ]
});

这个 results.php 文件返回以下内容：；

"data": [
    [
      "Joe",
      "me@example.com  ",
      "1",
      "1",
    ],
    [
      "Jim",
      "you@example.com  ",
      "1",
      "0",
    ],
    [
      "Sara",
      "him@example.com  ",
      "0",
      "0",
    ],
]

我的前端html表如下所示；

+------+-----------------+----------+------------+
| name | email           | status   |complete    |
+------+-----------------+----------+------------+
| Joe  | me@example.com  | active   |complete    |
+------+-----------------+----------+------------+
| Jim  | you@example.com | active   |incomplete  | 
+------+-----------------+----------+------------+
| Sara | him@example.com | inactive |incomplete  |
+------+-----------------+----------+------------+

目前过滤器似乎在过滤数据库 int 值，而不是单元格文本。
我怎样才能搜索单词而不是 0 以及 1 .

mysql jquery JavaScript datatables

来源：https://stackoverflow.com/questions/53304941/datatables-filter-cell-content-not-db-value

1条答案

按热度按时间

dfddblmv1#

下面的工作似乎很好。结果键入“inactive”只显示sara。你有什么不同的做法？
编辑：我已经更新了代码段以匹配您的最新代码。似乎您正在为数据传递一个数组，所以我很惊讶您的表甚至正在初始化，因为 data 在这种情况下，选项无效（如何 data 选择 "name" 属性，如果它在结果集中不存在？它应该是数组索引）。将数据选项更新到数组索引后，表将正确搜索呈现的表。搜索“incomplete”返回jim/sara，而搜索“inactive”返回sara。

$(document).ready(function() {
  var data = getDummyData();
  $('#example').dataTable({
    "data": data,
    "columns": [{
        "data": 0
      },
      {
        "data": 1
      },
      {
        "data": 2,
        "render": function(data, type, row, meta) {
          // row[2] returns an int of 0 or 1 from the db. inactive/active
          if (data == 0) {
            return `inactive`;
          }
          if (data == 1) {
            return `active`;
          }
        }
      },
      {
        "data": 3,
        "render": function(data, type, row, meta) {
          // row[2] returns an int of 0 or 1 from the db. incomplete/complete
          if (data == 0) {
            return `incomplete`;
          }
          if (data == 1) {
            return `complete`;
          }
        }
      },
    ]
  });
});

function getDummyData() {
  return [
    [
      "Joe",
      "me@example.com  ",
      "1",
      "1",
    ],
    [
      "Jim",
      "you@example.com  ",
      "1",
      "0",
    ],
    [
      "Sara",
      "him@example.com  ",
      "0",
      "0",
    ],
  ]
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>

<table id="example">
  <thead>
    <tr>
      <th>name</th>
      <th>email</th>
      <th>status</th>
      <th>complete</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

赞(0）回复(0）举报 2021-06-18

我来回答

datatables筛选单元格内容而不是db值

1条答案

相关问题

热门标签

最新问答