数据表未正确排序答案

【问题标题】：DataTables not sorting properly数据表未正确排序
【发布时间】：2019-04-30 11:49:55
【问题描述】：

我正在为我的项目使用 DataTables，但它的排序功能无法正常工作。我在这里尝试了每一个解决方案，但没有一个对我有用，也没有在控制台中显示错误。我认为在我的代码中存在 jQuery 冲突。我该如何解决这个问题？有什么帮助吗？

<table id="dtBasicExample" class="table table-bordered table-hover contact-list" cellspacing="0"
                       width="100%">
                    <thead>
                    <tr>
                        {#                            <th scope="col"><input type="checkbox"></th>#}
                        <th scope="col">Name</th>
                        <th scope="col">Company Name</th>
                        <th scope="col">Email</th>
                        <th scope="col">Phone Number</th>
                    </tr>
                    </thead>
                    {% for contact in contacts %}
                        <tbody>
                        <tr data-id="{{ contact.id }}" class="clickable-row"
                            data-href="{% url 'contact-detail' contact.id %}"
                            style="cursor: pointer; ">
                            {#                                <th scope="row"><input type="checkbox" id="check"></th>#}
                            <td>{{ contact.client_name }}</td>
                            <td>{{ contact.client_company_name }}</td>
                            <td>{{ contact.email }}</td>
                            <td>{{ contact.work_phone }}</td>
                        </tr>
                        </tbody>
                    {% endfor %}
                </table>
                {% csrf_token %}

$('#dtBasicExample').DataTable();
$('.dataTables_length').addClass('bs-select');

如您所见，它是一种材料引导设计数据表。在显示的示例中，它可以工作，但是当我添加到我的项目时，它不会。

【问题讨论】：

您的代码总结为两行？提供的 2 行工作正常，没有错误。也许如果您发布一个现场示例，我们可以帮助您解决问题。
这里你可以看看
“无法正常工作”是什么意思？它是排序错误的方式，还是根本不起作用？
注意：标签tbody在你的循环中，你可以将它导出到for循环之外。
哎呀，错误就是为什么我没有注意到这一点:)) @R3tep 非常感谢您的建议

标签： javascript jquery datatables

【解决方案1】：

您的 html 表“无效”（如果您想在父表中创建多个表，则它是有效的）。这可能会给 Datatable 带来一些问题。我认为排序已经完成，但你看不到它，因为它是按 tbody 标签排序的，并且有一行是按 tbody 排序的。 tbody 标签不只排序里面的 tr

尝试将tbody 删除到您的循环中并将其导出到 for 循环之外。

<tbody>
  {% for contact in contacts %}
  // ...
  {% endfor %}
</tbody>

注意：cellspacing="0" 是旧版 html。你可以用css属性border-spacing替换它

【讨论】：