layui异步加载table表中某一列数据的例子


Posted in Javascript onSeptember 16, 2019

layui中table加载数据时 如果数据存放在不同数据表中 那样一个请求拼接每行表格数据 然后统一返回 太慢

//页面加载时请求 另一张表的数据
 var slotGroup;
  admin.req({
    url: '请求地址'
    , method: 'POST'
    , dataType: "json"
    , async: false
    , success: function (res) {
      slotGroup = res.data;
      console.log(slotGroup)
    }
  });

  table.render({
    elem: '#LAY-ad_pass-list'
    ,url: '请求地址' //模拟接口
    ,cols: [[
      {field: 'id', title: 'ID', sort: true}
      ,{field: 'pass_name', title: '通道名称'}
      ,{field: 'pass_code', title: '通道code'}
//注意::此处使用function 返回此列需要展示的数据
      ,{field: 'remark', title: '描述',templet: function (d) {
        return getRemark(d.id)
      } }
      ,{field: 'adState', title: '状态'}
      ,{field: 'updateTime', title: '时间'}
      ,{title: '操作',width: 200, align: 'center', fixed: 'right', toolbar: '#table-forum-list'}
    ]]
    ,page: false
    , text: {
      none: '暂无相关数据'
    }
    , done: function(res, curr, count){
      // console.log(res);
    }
  });

//遍历展示一开始的数据
  function getRemark(v) {
    var showGroup = '';
    if (v == null || v == undefined) return showGroup;
    if (slotGroup != null && slotGroup != undefined) {
      for (var i = 0; i < slotGroup.length; i++) {
        if ( parseInt(slotGroup[i].id)== parseInt(v)) {
          showGroup = slotGroup[i].pass_name;
          return showGroup;
        }
      }
    }
    return showGroup;
  }

以上这篇layui异步加载table表中某一列数据的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
onbeforeunload与onunload事件异同点总结
Jun 24 Javascript
JS短路原理的应用示例 精简代码的途径
Dec 13 Javascript
javascript动态判断html元素并执行不同的操作
Jun 16 Javascript
禁止iframe脚本弹出的窗口覆盖了父窗口的方法
Sep 06 Javascript
JS实现转动随机数抽奖特效代码
Apr 16 Javascript
jquery zTree异步加载简单实例讲解
Feb 25 Javascript
JavaScript中的ajax功能的概念和示例详解
Oct 17 Javascript
9个让JavaScript调试更简单的Console命令
Nov 14 Javascript
解决JSON.stringify()自动将中文转译成unicode的问题
Jan 05 Javascript
js中位运算的运用实例分析
Dec 11 Javascript
在Koa.js中实现文件上传的接口功能
Oct 08 Javascript
js禁止查看源文件屏蔽Ctrl+u/s、F12、右键等兼容IE火狐chrome
Oct 01 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
Sep 16 #Javascript
浅谈JS中几种轻松处理'this'指向方式
Sep 16 #Javascript
使用xampp将angular项目运行在web服务器的教程
Sep 16 #Javascript
在layui.use 中自定义 function 的正确方法
Sep 16 #Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
Sep 16 #Javascript
js实现无限瀑布流实例方法
Sep 16 #Javascript
策略模式实现 Vue 动态表单验证的方法
Sep 16 #Javascript
You might like
joomla内置的表单验证功能使用方法
2010/06/11 PHP
php 安全过滤函数代码
2011/05/07 PHP
(PHP实现)只使用++运算实现加法,减法,乘法,除法
2013/06/27 PHP
如何优雅的使用 laravel 的 validator验证方法
2018/11/11 PHP
使用PHP+Redis实现延迟任务,实现自动取消订单功能
2019/11/21 PHP
JS 显示当前日期与时间的代码
2010/03/24 Javascript
jQuery 过滤not()与filter()实例代码
2012/05/10 Javascript
JS 跳转页面延迟2种方法
2013/03/29 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
2014/10/11 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
AngularJS手动表单验证
2016/02/01 Javascript
ichart.js绘制虚线、平均分虚线效果的实现代码
2016/05/05 Javascript
jQuery简单实现点击文本框复制内容到剪贴板上的方法
2016/08/01 Javascript
Vue.js 表单校验插件
2016/08/14 Javascript
Bootstrap进度条实现代码解析
2017/03/07 Javascript
详解axios在node.js中的post使用
2017/04/27 Javascript
JavaScript命令模式原理与用法实例详解
2020/03/10 Javascript
python读取浮点数和读取文本文件示例
2014/05/06 Python
Python实现多线程抓取网页功能实例详解
2017/06/08 Python
pip命令无法使用的解决方法
2018/06/12 Python
Python实现购物评论文本情感分析操作【基于中文文本挖掘库snownlp】
2018/08/07 Python
在python中实现同行输入/接收多个数据的示例
2019/07/20 Python
Python数组并集交集补集代码实例
2020/02/18 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
带有css3动画效果的兼容多浏览器简单导航条示例
2014/01/26 HTML / CSS
印尼在线精品店:Berrybenka.com
2016/10/22 全球购物
SmartBuyGlasses中国:唯视良品(销售名牌太阳镜、墨镜和眼镜框)
2017/07/03 全球购物
10条PHP编程习惯
2014/05/26 面试题
EJB需直接实现它的业务接口或Home接口吗,请简述理由
2016/11/23 面试题
交通安全演讲稿
2014/01/07 职场文书
保密承诺书范文
2014/03/27 职场文书
班级出游活动计划书
2014/08/15 职场文书
质量在我心中演讲稿
2014/09/02 职场文书
擅自离岗检讨书
2014/09/12 职场文书
PHP使用QR Code生成二维码实例
2021/07/07 PHP
Redis sentinel哨兵集群的实现步骤
2022/07/15 Redis