使用Ajax.Reload()重载Datatables时出现随机失效问题

问题核心是fetch为异步非阻塞API，你当前的写法会同时触发新增请求与表格重载请求，两个请求并行执行无先后顺序：

• 若新增请求先被后端处理完成，重载请求就能拿到最新数据，表现为正常
• 若重载请求先被后端处理完成，此时新增逻辑还未执行完毕，重载拿到的是旧数据，表现为重载失效

添加断点时相当于人为阻塞了重载逻辑的执行，给了fetch足够的时间完成请求，因此每次都能正常生效，和事件监听器的使用无关。

将表格重载逻辑放到fetch的成功回调中，等待新增请求完成后再触发重载，推荐使用async/await语法简化异步逻辑，修正后的表单提交代码如下：

const formAddUrl = document.getElementById('formAddUrl');

formAddUrl.addEventListener('submit', async function (e) {
    e.preventDefault();
    const formData = new FormData(this);
    try {
        // 等待新增请求完成
        const response = await fetch('/LoanOfficerUrl/AddOfficerPararameter', {
            method: 'post',
            body: formData
        });
        // 仅当新增请求成功时刷新表格
        if (response.ok) {
            table.ajax.reload();
        }
    } catch (error) {
        // 此处可自定义新增失败的提示逻辑
        console.error('新增操作失败：', error);
    }
});

另外你提供的Datatable初始化代码存在语法错误：rowGroup配置的endRender方法中，' + Officer Id: ' + 缺少字符串开头的单引号，会导致运行时报错，修正为'Officer Id: '即可。

内容的提问来源于stack exchange，提问作者AJ Jones