2023年11月26日发(作者:)

layui表格修改(编辑)功能的实现,弹出表单框进⾏编辑,然后修改成功后表

格数据⾃动更新

layui表格修改(编辑)功能的实现,弹出表单框进⾏编辑,然后修改成功后表格数据⾃动更新

(1)主界⾯

本系统没有采⽤分页数据请求,直接取出后台全部数据

修改代码详解

Data-Table </span><span style='font-size:11.523px;color:#aab1be;letter-spacing:0.011px;font-family:HiraginoSansGB-W3;'>表格</span><span style='font-size:11.523px;color:#aab1be;letter-spacing:0.048px;font-family:NimbusSanL-Regu;'>

批量添加

采集设备总数

添加

搜索条件:

, cols: [[ //标题栏

{checkbox: true, sort: true, fixed: true, space: true}

, {field: 'eqptType', title: 'eqptType', width: 150}

, {field: 'eqptTypeName', title: 'eqptTypeName', width: 150}

, {field: 'eqptIdCode', title: 'eqptIdCode', width: 150}

, {field: 'eqptName', title: 'eqptName', width: 180}

, {field: 'createTime', title: 'createTime', width: 200}

, {field: 'creator', title: 'creator', width: 100}

, {fixed: 'right', width: 178, align: 'center', toolbar: '#barOption'}

]]

, id: 'dataCheck'

// , url: '../json/decice_'

,url:'/getCollectorInfo'

, method: 'get'

, page: false

, limits: [30, 60, 90, 150, 300]

, loading: false

, done: function (res) {

//如果是异步请求数据⽅式,res即为你接⼝返回的信息。

//如果是直接赋值的⽅式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度

(res);

}

});

//监听表格复选框选择

('checkbox(demo)', function (obj) {

(obj)

});

//监听⼯具条

('tool(test)', function (obj) {

var data = ;

if ( === 'detail') {

('ID' + + ' 的查看操作');

} else if ( === 'del') {

m('真的删除⾏么', function (index) {

$.ajax({

url: "/deleteCollector",

type: "POST",

data: {eqptType: pe, eqptIdCode: Code},

success: function (msg) {

var json = (msg);

var returnCode = Code;

title: "修改采集设备信息",

area: ['420px', '330px'],

content: $("#popUpdateTest"//引⽤的弹出层的页⾯层的⽅式加载修改界⾯表单

});

//动态向表传递赋值可以参看⽂章进⾏修改界⾯的更新前数据的显⽰,当然也是异步请求的要数据的修改数据的获取

setFormValue(obj,data);

}

}

});

//监听弹出框表单提交,massage是修改界⾯的表单数据'submit(demo11),是修改按钮的绑定

function setFormValue(obj,data){

('submit(demo11)', function(massage) {

$.ajax({

url:'/updateCollectorAndConfig',

type:'POST',

data:{oldeqptType:pe,oldeqptIdCode:Code,neweqptType:tType,neweqptIdCode:.n

eweqptIdCode,eqptName:"修改采集器"},

success:function (msg) {

var returnCode = Code;//取得返回数据(Sting类型的字符串)的信息进⾏取值判断

if(returnCode==200){

ll('loading');

(2);

("修改成功", {icon: 6});

setTimeout(function(){

({

eqptType:tType,

eqptIdCode:tIdCode,

eqptName:tName

});//修改成功修改表格数据不进⾏跳转

ll();//关闭所有的弹出层

}, 1000);

加载层-风格

({

type: 1,

area: ['250px', '180px'],

btn: '关闭',

shadeClose: true, //点击遮罩关闭

content: '

' + msg + '
'

, yes: function () {

ll();

}

});

}

});

});

//搜索功能的实现

$('.demoTable .layui-btn').on('click', function () {

var type = $(this).data('type');