空间站免费版下载_网站建站平台是什么_站长工具seo综合查询怎么关闭_建站平台如何隐藏技术支持

Easyui datagrid formatter 删除行失败解决

问题现象

使用formatter 为每行新增一个删除操作，,删除第一个行的时候没问题，如果存在多行的时候，当删除行时，提示错误

问题原因

因为是使用 formatter 相当于每行在渲染的时候index已经固定了，因此我在删除的时候就会出现index错误

解决方案

1、使用checkbox选择框进行删除（非行编辑）；
2、在每次删除之后重新的渲染formatter 使得index更新

由于需求要求按行删除，因此选择方案2

错误代码

function formatOpt(value, row, index){return '<a href="javascript:void(0)" οnclick="deleteRow('+index+')"><font color="blue" style="text-decoration:underline">删除</font></a> '
}/*删除行*/
function deleteRow(index){$('#addTable').datagrid.('deleteRow',index)
}

修改后代码

function formatOpt(value, row, index){return '<a href="javascript:void(0)" οnclick="deleteRow('+index+')"><font color="blue" style="text-decoration:underline">删除</font></a> '
}/*删除行*/
function deleteRow(index){console.log('index',index)let dg = $('#addTable');// 从数据源中删除该行数据let dataSource = dg.datagrid('getData');dataSource.rows.splice(index, 1);dg.datagrid('loadData', dataSource);// 重新设置formatter相关逻辑，更新索引dg.datagrid('getColumnOption', 'id').formatter = function(value, row, index){return '<a href="javascript:void(0)" οnclick="deleteRow('+index+')"><font color="blue" style="text-decoration:underline">删除</font></a> ';};
}

如果每次删除之后和服务器交互刷新datagrid也可以解决此问题；