一.Ajax向后台传递数组问题:(声明前台我使用的layui框架)
例:我们要多前台一个数据表格进行批量删除操作,我们通过复选框选中数据id,将id存入一个数组中,然后利用ajax传递给后台,完成批量删除,再过程中我们需要加上Traditional : true
代码如下:
例:我们要多前台一个数据表格进行批量删除操作,我们通过复选框选中数据id,将id存入一个数组中,然后利用ajax传递给后台,完成批量删除,再过程中我们需要加上Traditional : true
代码如下:
function batchDel() { var datas; var ids = new Array();// 声明数组 layui.use(‘table‘,function() { var table = layui.table; var checkStatus = table.checkStatus(‘encryptionTable‘);// 声明复选框 datas = checkStatus.data; for ( var i in datas) { ids[i] = datas[i].id;// 得到复选框的值 } if (ids.length != 0) { $.ajax({ url : "/admin/encryption/delete.json",type : "post",Traditional : true,// 这里设置为true,不然后台接收到的参数会带上[],导致数据无法正常接收 data : { "ids" : ids },success : function(data) { alert("删除成功"); table.reload("encryptionTable"); layer.close(index); } }); } else { layer.open({ title : ‘操作提示‘,content : ‘请至少选择一行数据要删除数据..‘ }); } }); }
二.Layui父页面给子页面传值
例如:我们需要获取父页面table中的数据id然后子页面需要根据这个id取查询此行数据的详细信息进行展示,完成查看的逻辑,此时我们就需要用到layui父页面值给子页面,子页面进行接收,我们需要在弹出子页面时url中将已经拿到的id传过去
代码:
弹出层:
var id=data.id; //创建一个HTML 对象 var html = "see.html"; var url = "/admin/encryption/seeEncryption/"+html+".do?id="+id; parent.layer.open({ title: [‘文件系统资源明细‘,‘font-size:16px;background-color:#5FB878‘],type: 2,resize: false,// 禁止拉伸 move: true,maxmin: false,// 开启最大化最小化按钮 skin: ‘layui-layer-rim‘,//样式类名 area: [‘740px‘,‘300px‘],content:url,btn : [ "确定","取消" ],skin : ‘layui-layer-molv‘,yes : function(index,layero) { parent.layer.close(index) },end : function() { //iframe销毁后触发的函数 } });
子页面中获取id,利用ajax传递给后台在获取后台返回的数据,然后根据id赋值给input表单中
layui.use(‘table‘,function() { var id = ${parameter.id}; //从父页面取到传过来的id,用ajax请求后台进行操作 $.ajax({ url : "/admin/encryption/see.json",dataType : "json",data : { "id" :id },success : function(data) { if(data!=null){ $("#edname").val(data.data.edname); $("#edIdentification").val(data.data.edIdentification); $("#edplain").val(data.data.edplain); $("#edAlgorithm").val(data.data.edAlgorithm); $("#edSecretKey").val(data.data.edSecretKey); }else{ alert("查询数据为空..."); } } }); });
三.父页面如何获取子页面的数据
例:例如我们的子页面中input文本框,select下拉选项框,还单选或多选的按钮,我们在父页面如何拿到这些输入的或是选中的参数
代码:
var edname = parent.layer.getChildFrame(‘#edname‘,index).val(); var edplain = parent.layer.getChildFrame(‘#edplain‘,index).val(); var edAlgorithm = parent.layer.getChildFrame(‘#edAlgorithm option:selected‘,index).val();//获取下拉菜单选中的值 var edSecretKey = parent.layer.getChildFrame(‘#edSecretKey‘,index).val(); var encryptionOutput = parent.layer.getChildFrame(‘#encryptionOutput input:checked‘,index).val(); var encryptionInput = parent.layer.getChildFrame(‘#encryptionInput input:checked‘,index).val();//获取选中按钮的值
四.Layui中表格数据的替换
例:我们在数据库中获取的状态status信息为0和1的形式,我们怎么能让他在前台显示是以“已发布”“已停用”形式的字符展示,前提我们
代码:
{ field : ‘edStatus‘,title : ‘状态‘,toolbar :‘#statusDemo‘,width : 110,fixed : ‘left‘ } <script type="text/html" id="statusDemo"> {{#if (d.edStatus == 0) { }} <span style="color:#FF5722;">已发布</span> {{# }else if(d.edStatus == 1){ }} <span>已停用</span> {{# } }} </script>
五.如何拿到后台数据将其动态赋值给前台select下来菜单中
例:我们从后台数据中获取到了各种服务,需要将其赋值给下拉菜单
代码:
initSelect:function(){ $.ajax({ url : ‘/admin/configure/servnames.json‘,dataType : ‘json‘,type : ‘POST‘,success : function(data) { $("#serviceName").append(‘<option value="">请选择服务</option>‘); $.each(data.data,function(index,item) { $("#serviceName").append(‘<option value="‘+item.serviceName+‘">‘ + item.serviceName + ‘</option>‘); }); form.render(‘select‘);//下拉菜单渲染 把内容加载进去 } }); }
parent.layer.open({ title : ‘算法方案添加提示‘,content : ‘请将方案数据新增成功,是否继续添加?‘ });
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。