Django模板中DataTables无法正常初始化无报错,求配置排查
问题排查及解决方案
- 问题1:表头与表体列数不匹配
你的<thead>中仅定义了8个<th>表头列,但是<tbody>每个数据行包含10个<td>数据列(多了Edit、Delete操作列),Datatables要求表头和表体的列数必须完全一致,否则会静默初始化失败,无报错也无预期效果。
修复方案:在<thead>的<tr>末尾补充两个表头列,示例:
<th>编辑</th> <th>删除</th>
问题2:jQuery重复加载冲突
你在引入Datatables资源前单独加载了jQuery 3.5.1,而你使用的Datatables CDN包已经内置了jQuery 3.6.0,两个不同版本的jQuery同时加载会导致Datatables挂载异常。
修复方案:删除单独引入jQuery 3.5.1的<script>标签,直接使用Datatables内置的jQuery版本即可。可选调试步骤
如果修复上述问题后仍无效果,可以在初始化代码前加打印验证DOM元素是否被正确识别:
$(document).ready( function () { console.log($('#table_id').length); // 正常输出为1说明成功找到表格元素 $('#table_id').DataTable(); } );
如果输出为0,说明表格元素加载顺序有问题,可以将初始化代码移到表格DOM的下方,或者替换为window.onload事件触发初始化。
内容的提问来源于stack exchange,提问作者Stephen
相关产品推荐
相关产品推荐

