这取决于您实现前端的方式，但是假设您具有标准的django模板，那么我建议您看一下 bootstrap 随意设置样式.

It depends on how you've implemented your frontend, but assuming you have standard django templates, then I would suggest taking a look at datatables. There's quite a lot to it, but it is very stable and has a decent feature set, and the documentation is good. You can style it how you want using bootstrap.

此外，您链接到Bootstrap Table-应该是相同的原理.通读文档以了解其工作原理，然后您将不得不使用Django模板标签在表中呈现数据.

Also, you link to Bootstrap Table - that should be the same principle. Read through the docs to understand how it works, and you will have to use Django template tags to render the data in the table.

请注意，该表是使用HTML/Jquery实现的，因此它与Django没有直接关系.您需要做的就是遍历模板中的django对象(示例)

Note that the table is implemented using HTML / Jquery, so it is not directly related to Django. All you need to do is to iterate over the django objects in your template (example)

编辑

如何删除选定的行?

How to delete a selected row?

假设您可以选择N行，然后单击一个按钮以删除所有这些行.

Suppose you could select N rows, and then click a button to delete all of these rows.

这可能如下:

• 将处理程序添加到删除按钮:
• 识别选定的行
• 发送Ajax请求以删除行
• 处理成功响应以从表中删除已删除的行

// SIMPLIFIED CODE SAMPLE

$("#delete-btn").click(function () {
  var selectedRows = table.rows({"selected": true});

  var dataObj = {
    // parse selectedRows to get object ids
  }
  
  $.ajax({
      url: '/api/delete-rows/',
      type: 'post',
      data: dataObj,
      success: function (data, status, xhr) {
        // remove the selected rows from the view
        table.rows({"selected": true}).deselect().remove().draw();
      }
    })
}

如何选择行并快速更改所有选定行的字段?

How to select rows and quickly change a field for all of the selected rows?

这里的原理相同.选定行后，请有一个标识选定行的处理程序，然后您可以使用datatables api更新给定的字段(

The same principle here. Once rows are selected, have a handler which identifies the selected rows, then you can use the datatables api to update given fields (docs).