jQuery DataTable添加数据行后无法显示问题求助

核心错误点 #

• 多行数据添加API误用：row.add()仅用于添加单行数据，你将多行数据数组传入后会导致DataTable解析异常，正确的多行添加API是rows.add()（复数形式）。
• 循环逻辑错误：
  1. 循环条件i <= res.length会多执行一次循环（例如res有2条数据时，i会遍历0、1、2共3次），应改为i < res.length。
  2. 循环中始终取res[0]的数据，未遍历res内的所有记录，需用res[i]获取当前循环项的内容。
• 重复初始化DataTable：每次success回调内都执行$('#resTable').DataTable()，易引发实例冲突，建议提前初始化表格。

修正后的代码 #

提前初始化DataTable（页面加载完成后执行）

$(document).ready(function() {
    // 提前初始化表格，避免重复实例化
    $('#resTable').DataTable();
});

修正success回调内的代码

success: function(res) {
    document.getElementById("success").style.display = 'block';
    $("#numeroFile").val(0);
    $('input[name=pathIniziale]').val("");
    $("#templateOption").prop('checked', false);
    console.log(res);
    
    let newRows = [];
    let t = $('#resTable').DataTable();
    
    // 修正循环条件，遍历res中每条数据
    for(var i = 0; i < res.length; i++){
        // 使用res[i]获取当前项的标题和路径，i+1作为序号（避免从0开始）
        newRows.push([i+1, res[i].titolo, res[i].path]);
    }
    
    // 用rows.add()添加多行数据，再调用draw更新表格
    t.rows.add(newRows).draw();
}

额外说明 #

• 若接口返回的res是单个对象而非数组（仅单条数据），则无需循环，直接构造单行数组传入row.add()即可：

  let newRow = [1, res.titolo, res.path];
  t.row.add(newRow).draw();
  

• 需确保接口返回的res是标准数组格式，且每个元素都包含titolo和path字段。

内容的提问来源于stack exchange，提问作者Maria Scetta