浅谈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 相关文章推荐
js中的escape及unescape函数的php实现代码
Sep 04 Javascript
js继承的实现代码
Aug 05 Javascript
JQuery拖动表头边框线调整表格列宽效果代码
Sep 10 Javascript
如何编写高质量JS代码(续)
Feb 25 Javascript
JS烟花背景效果实现方法
Mar 03 Javascript
js制作带有遮罩弹出层实现登录注册表单特效代码分享
Sep 05 Javascript
JS如何生成一个不重复的ID的函数
Dec 25 Javascript
js实现随机数字字母验证码
Jun 19 Javascript
JavaScript之事件委托实例(附原生js和jQuery代码)
Jul 22 jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 jQuery
Webpack实战加载SVG的方法
Dec 26 Javascript
javascript运行机制之执行顺序理解
Aug 03 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中显示格式化的用户输入
2006/10/09 PHP
用PHP伪造referer突破网盘禁止外连的代码
2008/06/15 PHP
thinkphp判断访客为手机端或PC端的方法
2014/11/24 PHP
如何使用php脚本给html中引用的js和css路径打上版本号
2015/11/18 PHP
ThinkPHP中调用PHPExcel的实现代码
2017/04/08 PHP
写js时遇到的一些小问题
2010/12/06 Javascript
javascript中万恶的function实例分析
2011/05/25 Javascript
jquery如何把数组变为字符串传到服务端并处理
2014/04/30 Javascript
关于javaScript注册click事件传递参数的不成功问题
2014/07/18 Javascript
浅谈jQuery hover(over, out)事件函数
2016/12/03 Javascript
jQuery Validate让普通按钮触发表单验证的方法
2016/12/15 Javascript
jQuery操作json常用方法示例
2017/01/04 Javascript
原生JS实现ajax与ajax的跨域请求实例
2017/12/01 Javascript
Vuex 模块化使用详解
2019/07/31 Javascript
Layui点击图片弹框预览的实现方法
2019/09/16 Javascript
JS代码屏蔽F12,右键,粘贴,复制,剪切,选中,操作实例
2019/09/17 Javascript
[59:07]海涛为你详解DOTA2新版本“贤哲秘契”
2014/11/22 DOTA
python笔记(2)
2012/10/24 Python
python list语法学习(带例子)
2013/11/01 Python
Python中的闭包实例详解
2014/08/29 Python
Python实现求数列和的方法示例
2018/01/12 Python
python3 json数据格式的转换(dumps/loads的使用、dict to str/str to dict、json字符串/字典的相互转换)
2019/04/01 Python
Django框架静态文件使用/中间件/禁用ip功能实例详解
2019/07/22 Python
python3 写一个WAV音频文件播放器的代码
2019/09/27 Python
Pycharm 2019 破解激活方法图文详解
2019/10/11 Python
python pandas利用fillna方法实现部分自动填充功能
2020/03/16 Python
Python使用正则表达式实现爬虫数据抽取
2020/08/17 Python
Photobook澳大利亚:制作相片书,婚礼卡,旅行相簿
2017/01/12 全球购物
值类型与引用类型有什么不同?请举例说明?并分别列举几种相应的数据类型
2015/10/24 面试题
触摸春天教学反思
2014/02/03 职场文书
一年级班主任感言
2014/03/08 职场文书
服务之星事迹材料
2014/05/03 职场文书
物流管理专业求职信
2014/05/29 职场文书
邀请函怎么写
2015/01/30 职场文书
2016校本研修培训心得体会
2016/01/08 职场文书
2016先进工作者事迹材料
2016/02/25 职场文书