浅谈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 相关文章推荐
jQuery的强大选择器小结
Dec 27 Javascript
用js实现输入提示(自动完成)的实例代码
Jun 14 Javascript
javascript中Number对象的toString()方法分析
Dec 20 Javascript
AngularJS+Node.js实现在线聊天室
Aug 28 Javascript
jQuery实现的省市县三级联动菜单效果完整实例
Aug 01 Javascript
jQuery展示表格点击变色、全选、删除
Jan 05 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
Apr 27 Javascript
ExtJs的Ext.Ajax.request实现waitMsg等待提示效果
Jun 14 Javascript
实例教学如何写vue插件
Nov 30 Javascript
详解Webpack实战之构建 Electron 应用
Dec 25 Javascript
vue props传值失败 输出undefined的解决方法
Sep 11 Javascript
Vue页面手动刷新,实现导航栏激活项还原到初始状态
Aug 06 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日历制作代码分享
2014/01/20 PHP
Codeigniter生成Excel文档的简单方法
2014/06/12 PHP
PHP_SELF,SCRIPT_NAME,REQUEST_URI区别
2014/12/24 PHP
php使用iconv中文截断问题的解决方法
2015/02/11 PHP
浅析ThinkPHP缓存之快速缓存(F方法)和动态缓存(S方法)(日常整理)
2015/10/26 PHP
Zend Framework教程之模型Model基本规则和使用方法
2016/03/04 PHP
PHP Static延迟静态绑定用法分析
2016/03/16 PHP
PHP实现加密文本文件并限制特定页面的存取的效果
2016/10/21 PHP
IE6下CSS图片缓存问题解决方法
2010/12/09 Javascript
15个款优秀的 jQuery 图片特效插件推荐
2011/11/21 Javascript
php中给js数组赋值方法
2014/03/10 Javascript
jQuery如何将选中的对象转化为原始的DOM对象
2014/06/09 Javascript
JavaScript中使用自然对数ln的方法
2015/06/14 Javascript
Javascript验证Visa和MasterCard信用卡号的方法
2015/07/27 Javascript
jQuery插件dataTables添加序号列的方法
2016/07/06 Javascript
js数组去重的hash方法
2016/12/22 Javascript
Nodejs实现文件上传的示例代码
2017/09/26 NodeJs
nodejs 日志模块winston的使用方法
2018/05/02 NodeJs
Vue中android4.4不兼容问题的解决方法
2018/09/04 Javascript
JS实现音量控制拖动
2020/01/15 Javascript
Python类方法__init__和__del__构造、析构过程分析
2015/03/06 Python
python使用两种发邮件的方式smtp和outlook示例
2017/06/02 Python
Python实现改变与矩形橡胶的线条的颜色代码示例
2018/01/05 Python
python实现简单淘宝秒杀功能
2018/05/03 Python
mac安装scrapy并创建项目的实例讲解
2018/06/13 Python
Python类的继承用法示例
2019/01/31 Python
Python帮你微信头像任意添加装饰别再@微信官方了
2019/09/25 Python
python实现KNN分类算法
2019/10/16 Python
FC-Moto瑞典:欧洲最大的摩托车服装和头盔商店之一
2018/11/27 全球购物
精灵市场:Pixie Market
2019/06/18 全球购物
解释一下Windows的消息机制
2014/01/30 面试题
文明之星事迹材料
2014/05/09 职场文书
营销团队口号
2014/06/06 职场文书
2016党员党课心得体会
2016/01/07 职场文书
大脑的记忆过程在做数据压缩,不同图形也有共同的记忆格式
2022/04/29 数码科技
Navicat Premium自定义 sql 标签的创建方式
2022/09/23 数据库