浅谈layui分页控件field参数接收对象的问题


Posted in Javascript onSeptember 20, 2019

第一次使用layui分页控件,遇到的问题。。field: 'type.typeName' 获取不到值。

页面代码

table.render({
 elem: '#bookTable'
 ,height: 'full-20'     
 ,url: '/admin/getBook' //数据接口
 ,request: {
  pageName: 'begin' //页码的参数名称,默认:page
  ,limitName: 'length' //每页数据量的参数名,默认:limit
  }
 ,page: true //开启分页
 ,even: true
 ,cols: [[ //表头
  {checkbox: true, fixed: true}
  ,{field: 'bookid', title: 'ID', width:80, sort: true, fixed: 'left'}
  ,{field: 'bookname', title: '书名', width:250}
  ,{field: 'bookauthor', title: '作者', width:150}
  ,{field: 'bookpress', title: '出版社', width:150}
  ,{field: 'type', title: '类型', width:80}
  ,{fixed: 'right', title: '操作',width:150, align:'center', toolbar: '#handler'} //这里的toolbar值是模板元素的选择器
 ]]
 ,id: 'bookReload'
 });

对应页面

浅谈layui分页控件field参数接收对象的问题

我想拿到type的中文名称,正常思路,我会把代码改成

,{field: 'type.typeName', title: '类型', width:80}

可是这样,获取不到值。

然后研究发现,field这个属性是根据后台实体类的getXXX()方法获取值的。

注意,实体类是List泛型对应的实体类。例如我这里是List<Book>,然后我就到我的Book.java中新增一个方法:

浅谈layui分页控件field参数接收对象的问题

最后我就可以到页面上获取typeName

,{field: 'typeName', title: '类型', width:80}

最后页面效果:

浅谈layui分页控件field参数接收对象的问题

以上这篇浅谈layui分页控件field参数接收对象的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用JavaScript实现仿Windows关机效果
Mar 10 Javascript
用document.documentElement取代document.body的原因分析
Nov 12 Javascript
jQuery DOM操作小结与实例
Jan 07 Javascript
理解Javascript_13_执行模型详解
Oct 20 Javascript
javascript中input中readonly和disabled区别介绍
Oct 23 Javascript
JS判断字符串长度的5个方法(区分中文和英文)
Mar 18 Javascript
一个不错的仿携程自定义数据下拉选择select
Sep 01 Javascript
浅谈jQuery事件绑定原理
Jan 02 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
Aug 11 Javascript
基于javascript实现贪吃蛇小游戏
Nov 25 Javascript
vue 开发之路由配置方法详解
Dec 02 Javascript
JavaScript中document.activeELement焦点元素介绍
Nov 27 Javascript
vuex根据不同的用户权限展示不同的路由列表功能
Sep 20 #Javascript
微信小程序如何播放腾讯视频的实现
Sep 20 #Javascript
Vue+iview+webpack ie浏览器兼容简单处理
Sep 20 #Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
Sep 20 #Javascript
微信用户访问小程序的登录过程详解
Sep 20 #Javascript
解决layUI的页面显示不全的问题
Sep 20 #Javascript
小程序如何获取多个formId实现详解
Sep 20 #Javascript
You might like
PHP的FTP学习(一)[转自奥索]
2006/10/09 PHP
发款php蜘蛛统计插件只要有mysql就可用
2010/10/12 PHP
解析php中的fopen()函数用打开文件模式说明
2013/06/20 PHP
php把大写命名转换成下划线分割命名
2015/04/27 PHP
PHP中使用GD库绘制折线图 折线统计图的绘制方法
2015/11/09 PHP
JS截取字符串常用方法整理及使用示例
2013/10/18 Javascript
javascript如何创建表格(javascript绘制表格的二种方法)
2013/12/10 Javascript
jquery+ajax+C#实现无刷新操作数据库数据的简单实例
2014/02/08 Javascript
Jquery中Event对象属性小结
2015/02/27 Javascript
cocos2dx骨骼动画Armature源码剖析(三)
2015/09/08 Javascript
所见即所得的富文本编辑器bootstrap-wysiwyg使用方法详解
2016/05/27 Javascript
BootStrap table表格插件自适应固定表头(超好用)
2016/08/24 Javascript
基于Javascript实现文件实时加载进度的方法
2016/10/12 Javascript
老生常谈angularjs中的$state.go
2017/04/24 Javascript
微信小程序实现多宫格抽奖活动
2020/04/15 Javascript
jQuery实现遍历XML节点和属性的方法示例
2018/04/29 jQuery
node.js基于dgram数据报模块创建UDP服务器和客户端操作示例
2020/02/12 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
用Nodejs实现在终端中炒股的实现
2020/10/18 NodeJs
JavaScript setTimeout()基本用法有哪些
2020/11/04 Javascript
[50:11]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第三场
2018/04/09 DOTA
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
Django Aggregation聚合使用方法解析
2019/08/01 Python
Python中BeautifulSoup通过查找Id获取元素信息
2020/12/07 Python
naturalizer加拿大官网:美国娜然女鞋
2017/04/04 全球购物
美国最大的袜子制造商和零售商:Renfro Socks
2017/09/03 全球购物
高职助产应届生自荐信
2013/09/24 职场文书
护士自荐信
2013/10/25 职场文书
经管应届生求职信
2013/11/17 职场文书
开学寄语大全
2014/04/08 职场文书
活动总结范文
2014/08/30 职场文书
爱的奉献演讲稿
2014/09/10 职场文书
2014报到证办理个人委托书
2014/10/08 职场文书
收入证明范本
2015/06/12 职场文书
医生行业员工的辞职信
2019/06/24 职场文书
了解Redis常见应用场景
2021/06/23 Redis