浅谈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下为Event handler传递动态参数的代码
Jan 06 Javascript
ie支持function.bind()方法实现代码
Dec 27 Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 Javascript
JQuery处理json与ajax返回JSON实例代码
Jan 03 Javascript
jquery果冻抖动效果实现方法
Jan 15 Javascript
js实现YouKu的漂亮搜索框效果
Aug 19 Javascript
完美实现八种js焦点轮播图(下篇)
Apr 20 Javascript
AngularJS入门教程引导程序
Aug 18 Javascript
JS实现闭包中的沙箱模式示例
Sep 07 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
Aug 10 Javascript
webpack4+react多页面架构的实现
Oct 25 Javascript
vue视频播放暂停代码
Nov 08 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遍历数组的几种方法
2012/03/22 PHP
PHP rawurlencode与urlencode函数的深入分析
2013/06/08 PHP
php二维码生成
2015/10/19 PHP
postfixadmin忘记密码后的修改密码方法详解
2016/07/20 PHP
thinkphp的dump函数无输出实例代码
2016/11/15 PHP
阿里云Win2016安装Apache和PHP环境图文教程
2018/03/11 PHP
PHP sdk实现在线打包代码示例
2020/12/09 PHP
JavaScript基于setTimeout实现计数的方法
2015/05/08 Javascript
基于javascript实现动态显示当前系统时间
2016/01/28 Javascript
javascript实现仿百度图片的瀑布流加载效果
2016/04/20 Javascript
javascript实现延时显示提示框特效代码
2016/04/27 Javascript
JS两种类型的表单提交方法实例分析
2016/11/28 Javascript
Input文本框随着输入内容多少自动延伸的实现
2017/02/15 Javascript
微信小程序 template模板详解及实例
2017/02/21 Javascript
AngularJS折叠菜单实现方法示例
2017/05/18 Javascript
在Debian(Raspberry Pi)树莓派上安装NodeJS的教程详解
2017/09/19 NodeJs
基于vue-cli vue-router搭建底部导航栏移动前端项目
2018/02/28 Javascript
vue2.0自定义指令示例代码详解
2019/04/25 Javascript
微信小程序引入Vant组件库过程解析
2019/08/06 Javascript
深入浅析golang zap 日志库使用(含文件切割、分级别存储和全局使用等)
2020/02/19 Javascript
详解关于Vue单元测试的几个坑
2020/04/26 Javascript
vue项目中使用多选框的实例代码
2020/07/22 Javascript
python从入门到精通(DAY 1)
2015/12/20 Python
Python SQL查询并生成json文件操作示例
2018/08/17 Python
利用Python实现微信找房机器人实例教程
2019/03/10 Python
Python如何访问字符串中的值
2020/02/09 Python
html5跳转小程序wx-open-launch-weapp踩坑
2020/12/02 HTML / CSS
介绍一些UNIX常用简单命令
2014/11/11 面试题
高中班长自我鉴定
2013/12/20 职场文书
小学生优秀评语大全
2014/04/22 职场文书
购房公证委托书(2014版)
2014/09/12 职场文书
机关班子查摆问题及整改措施
2014/10/28 职场文书
销售会议开幕词
2016/03/04 职场文书
企业内部管理控制:银行存款控制制度范本
2020/01/10 职场文书
阿里云Nginx配置https实现域名访问项目(图文教程)
2021/03/31 Servers