EasyUI gridList 删除功能

1、HTML里面的写法

<div id="right2" style="border:1px #e7f2f9 solid;box-shadow:0 0 15px white;border-radius: 6px;width:97.5%;height:89%;line-height:60px;float:left;margin:0.5% 0 0 1%;">
　　<div class = ‘div_window_list div_overflow‘ style="height:93.5%;">
　　　　<table id="mapprocese" class="easyui-datagrid" style="border-radius:5px;">
　　　　<thead></thead>
　　　　</table>
　　</div>
</div>

2、自定义JS的写法

var NoData = "";

$(function(){
　　NoData = {"dataColumn":["ID","模式","设置","省份","地市","场景","数据","压缩"],"data":[{"ID":"20190917_1","模式":"中心点","设置":"自定义","省份":"河南","地市":"郑州","场景":"建筑物","数据":"112112","压缩":"是"},{"ID":"20190917_2","模式":"中心点","设置":"自定义","省份":"河南","地市":"郑州","场景":"建筑物","数据":"112112","压缩":"否"}]};
　　datalist(NoData);
});

function datalist(NoData){
　　initData2(NoData,"mapprocese","0");
};

3、gridList.js

function initData2(datas, position, flg) {
　　var datalistC = [];
　　var datalistD = [];
　　gridColumns = datas.dataColumn;
　　if (gridColumns.length == 0) {
　　　　gridColumns = null;
　　　　gridData = null;
　　　　shadeHide();
　　} else {
　　　　for (var v = 0; v < gridColumns.length; v++) {
　　　　datalistC.push(gridColumns[v]);
　　　　}
　　datalistD = datas.data;
　　initDataList2(datalistD, datalistC, position, flg);
}
}

//删除方法

function deleteRightGridRow(row){

　　var datas = $(‘#mapprocese‘).datagrid(‘getData‘);
　　for(var i=0;i<datas.rows.length;i++){
　　var datarow=datas.rows[i].ID;
　　if(datarow==row){//数据中的id和渲染时的id相等
　　//通过传入的id值查询到对应的记录，在获取实际的Index,这样去删除,（直接传入渲染好的索引值会出现错误）
　　var rowIndex = $(‘#mapprocese‘).datagrid(‘getRowIndex‘,datas.rows[i]);
　　$(‘#mapprocese‘).datagrid(‘deleteRow‘, rowIndex);
}
}
NoData = {"dataColumn":["ID","模式","设置","省份","地市","场景","数据","压缩"],"data":[]};
var vle = $(‘#mapprocese‘).datagrid(‘getData‘);

//删除完重写一遍列表
for (var i=0;i<vle.rows.length;i++){
NoData.data.push(vle.rows[i]);
}


}

function initDataList2(datalistD, datalistC, position, flg) {
var dataPc = [];
var columnArr = new Array();
for (var i = 0; i < datalistC.length; i++) {
var columnObj = new Object();
columnObj["title"] = datalistC[i];
columnObj["field"] = datalistC[i];
columnObj["width"] = 100;
columnObj["align"] = "center";
columnObj["dataalign"] = "left";
//columnObj["sortable"] = "true";
columnArr.push(columnObj);
}
var bnt = {
field: ‘opt‘, title: ‘操作‘, width: 100, align: ‘center‘,
formatter: function (val, row, index) {

var city=row.ID;//列表唯一标识

//为列表里的列添加按钮
var btn = ‘<a class="detail" onclick="deleteRightGridRow(\‘‘+city+‘\‘)" href="avascript:void(0)" style="text-decoration: none;color:inherit;">删除</ a>‘;
return btn;
}
};
columnArr.push(bnt);
dataPc.push(columnArr);
$("#" + position).datagrid(
{
height : 479,
width : 960,
//singleSelect : true,
rownumbers : true,
fitColumns : true,
checkOnSelect:false,
//remoteSort : true,
//pagination : true,
//pageSize : 20,
//pageList : [ 20, 40, 60 ],
data : datalistD.slice(0, 22),
columns : dataPc,
onClickRow : function(index, row) {
if("ClusterList" == position || "ClusterCell" == position ){
soMapOv.flyTo(row.经度,row.纬度,500);
//soMapOv.addIdeLayer(row.经度,row.纬度);
}
},
onSortColumn : function(sort, order) {
//$("#loadingPrompt").html("已发送一键派单数据");
},
onCheck : function(index, row) {
wkordArr.push(row.簇唯一编号);
},
onUncheck : function(index, row) {
var index = wkordArr.indexOf(row.簇唯一编号);
if (index > -1) {
wkordArr.splice(index, 1);
}
}
});
/*
var pager = $("#" + position).datagrid("getPager");

pager.pagination({
total : datalistD.length,
onSelectPage : function(pageNo, pageSize) {
var start = (pageNo - 1) * pageSize;
var end = start + pageSize;
$("#" + position).datagrid("loadData",
datalistD.slice(start, end));
pager.pagination(‘refresh‘, {
total : datalistD.length,
pageNumber : pageNo
});
}
});
*/
$(".datagrid-header-row input").css("display","none");
}

EasyUI gridList 删除功能

原文：https://www.cnblogs.com/gsjdeboke/p/11555680.html