浅谈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的高性能td和input切换并可修改内容实现代码
Jan 09 Javascript
给angular加上动画效遇到的问题总结
Feb 17 Javascript
使用Object.defineProperty实现简单的js双向绑定
Apr 15 Javascript
jQuery中事件与动画的总结分享
May 24 Javascript
AngularJS监听路由的变化示例代码
Sep 23 Javascript
JS实战篇之收缩菜单表单布局
Dec 10 Javascript
angular 实现同步验证器跨字段验证的方法
Apr 11 Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 Javascript
微信小程序仿淘宝热搜词在搜索框中轮播功能
Jan 21 Javascript
JS实现简易留言板(节点操作)
Mar 16 Javascript
jquery实现上传文件进度条
Mar 26 jQuery
Vant Weapp组件踩坑:picker的初始赋值解决
Nov 12 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 事件机制(2)
2011/03/23 PHP
PHP中改变图片的尺寸大小的代码
2011/07/17 PHP
PHP中捕获超时事件的方法实例
2015/02/12 PHP
PHP 5.3和PHP 5.4出现FastCGI Error解决方法
2015/02/12 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
JavaScript语言中的Literal Syntax特性分析
2007/03/08 Javascript
用js模拟JQuery的show与hide动画函数代码
2010/09/20 Javascript
jquery实现图片放大镜功能
2015/11/23 Javascript
jQuery设置单选按钮radio选中/不可用的实例代码
2016/06/24 Javascript
js获取一组日期中最近连续的天数
2017/05/25 Javascript
jquery 实现拖动文件上传加载进度条功能
2018/03/18 jQuery
vue .js绑定checkbox并获取、改变选中状态的实例
2018/08/24 Javascript
Python ORM框架SQLAlchemy学习笔记之关系映射实例
2014/06/10 Python
Python下的Softmax回归函数的实现方法(推荐)
2017/01/26 Python
Python使用pylab库实现画线功能的方法详解
2017/06/08 Python
django 删除数据库表后重新同步的方法
2018/05/27 Python
python 字典中取值的两种方法小结
2018/08/02 Python
使用Python实现跳一跳自动跳跃功能
2019/07/10 Python
python shutil文件操作工具使用实例分析
2019/12/25 Python
python深copy和浅copy区别对比解析
2019/12/26 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
python+gdal+遥感图像拼接(mosaic)的实例
2020/03/10 Python
Python实现多线程下载脚本的示例代码
2020/04/03 Python
外企C语言笔试题
2013/11/10 面试题
介绍一下常见的木马种类
2014/11/15 面试题
什么是符号链接,什么是硬链接?符号链接与硬链接的区别是什么?
2013/05/03 面试题
教你怎样写好自我评价
2013/10/05 职场文书
毕业生医学检验求职信
2013/10/16 职场文书
网络维护中文求职信
2014/01/03 职场文书
正风肃纪剖析材料
2014/02/18 职场文书
岗位廉政承诺书
2014/03/27 职场文书
优秀班主任推荐材料
2014/12/17 职场文书
千与千寻观后感
2015/06/04 职场文书
护士心得体会范文
2016/01/25 职场文书
goland 设置project gopath的操作
2021/05/06 Golang
前端实现滑动按钮AJAX与后端交互的示例代码
2022/02/24 Javascript