JS组件Bootstrap Table使用实例分享


Posted in Javascript onMay 30, 2016

学习使用bootstrap表格是对客户端进行分页的时候,在朋友的帮助下,找到了文档http://bootstrap-table.wenzhixin.net.cn/examples/                 
找到了传到后台的每页条数Limit,和记录开始数Offset。             
开始封装,分享一下我的代码,从bootstrap table 获取页码和页数,并交给后台处理。

$('#table').bootstrapTable({
  url: '<%=path%>/FeedList.cqzk',
  striped: true,
  pagination: true,
  pageList: [3,5,20],
  pageSize:3,
  pageNumber:1,
  sidePagination:'server',//设置为服务器端分页
  columns: [{
  field: 'title',
  title: '标题'
  }, {
  field: 'creatTime',
  title: '时间'
  } ]
 });



 @RequestMapping(value = "/FeedList.cqzk")
 @ResponseBody
 public String url_ad1(HttpServletRequest request,BootPage page) 
  throws ServletException,IOException,RuntimeException{
 
 @SuppressWarnings("unchecked") 
// List<Feedback> list = feedBackDao.find("from Feedback");
 BootPage pager = feedBackDao.getByPage("from Feedback",page,null);
 System.out.println((JSONArray.fromObject(pager)).getString(0).toString());
 return (JSONArray.fromObject(pager)).getString(0).toString(); 
 // 不写.getString(0) 就多一个中括号,返回的就是数组,写了就是返回第一个对象。
 }
 


public BootPage getByPage(String hql,BootPage pager,Map<String, Object> condition){
 if (pager == null) {
  throw new IllegalArgumentException("分页 不能为空!");
 }

 Query q = sessionFactory.getCurrentSession().createQuery(hql);
 q.setFirstResult(pager.getOffset());
 q.setMaxResults(pager.getLimit());

 if (condition != null) {
  q.setProperties(condition);
 }
 pager.setRows(q.list());
 pager.setTotal(this.countAll(hql, condition));
 return pager;
 
 }
 protected Long countAll(String hql, Map<String, Object> condition) {
 if (hql == null) {
  return 0l;
 }
 String tmpHql = hql.toLowerCase();
 String regex = hql.substring(0, tmpHql.indexOf("from"));
 hql = hql.replaceFirst(regex, "select count(*) ");
 Query q = sessionFactory.getCurrentSession().createQuery(hql);
 if (condition != null) {
  q.setProperties(condition);
 }
 return (Long) q.uniqueResult();
 }


public final class BootPage<T> {
 
 protected Long total;
 
 protected List<T> rows;
 
 protected int limit=0;
 
 protected int offset = 0;
 
 protected String order ="asc" ;

如果大家还想深入学习,可以点击这里进行学习,再为大家附3个精彩的专题:

以上就是为大家分享的Bootstrap Table使用方法,希望对大家熟练掌握Bootstrap Table使用方法有所帮助。

Javascript 相关文章推荐
csdn 博客的css样式 v3
Feb 24 Javascript
JS数组(Array)处理函数整理
Dec 07 Javascript
JS数组合并push与concat区别分析
Dec 17 Javascript
JQuery fileupload插件实现文件上传功能
Mar 18 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 Javascript
JavaScript登录记住密码操作(超简单代码)
Mar 22 Javascript
JS实现登录页密码的显示和隐藏功能
Dec 06 Javascript
浅谈webpack编译vue项目生成的代码探索
Dec 11 Javascript
vue页面切换到滚动页面显示顶部的实例
Mar 13 Javascript
JS实现为动态创建的元素添加事件操作示例
Mar 17 Javascript
解决angularJS中input标签的ng-change事件无效问题
Sep 13 Javascript
微信小程序的开发范式BeautyWe.js入门详解
Jul 10 Javascript
Bootstrap table分页问题汇总
May 30 #Javascript
浅析Javascript中bind()方法的使用与实现
May 30 #Javascript
Bootstrap Paginator分页插件使用方法详解
May 30 #Javascript
深入理解JavaScript中的call、apply、bind方法的区别
May 30 #Javascript
全面解析Bootstrap中transition、affix的使用方法
May 30 #Javascript
全面解析Bootstrap中form、navbar的使用方法
May 30 #Javascript
js实现页面a向页面b传参的方法
May 29 #Javascript
You might like
德生9700DX电路分析
2021/03/02 无线电
PHP+MySQL实现消息队列的方法分析
2018/05/09 PHP
thinkPHP3.2使用RBAC实现权限管理的实现
2019/08/27 PHP
laravel中数据显示方法(默认值和下拉option默认选中)
2019/10/11 PHP
php面向对象基础详解【星际争霸游戏案例】
2020/01/23 PHP
javascript 设计模式之单体模式 面向对象学习基础
2010/04/18 Javascript
jQuery 打造动态渐变按钮 详细图文教程
2010/04/25 Javascript
JavaScript中去掉数组中的重复值的实现方法
2011/08/03 Javascript
浅析Prototype的模板类 Template
2011/12/07 Javascript
window.open的页面如何刷新(父页面)上层页面
2012/12/28 Javascript
js隐藏与显示回到顶部按钮及window.onscroll事件应用
2013/01/25 Javascript
javascript验证邮件地址和MX记录的方法
2015/06/16 Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
2016/05/25 Javascript
jQuery的ajax下载blob文件
2016/07/21 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
2016/11/18 Javascript
微信小程序自定义多选事件的实现代码
2018/05/17 Javascript
原理深度解析Vue的响应式更新比React快
2020/04/04 Javascript
JavaScript Blob对象原理及用法详解
2020/10/14 Javascript
Python多线程实例教程
2014/09/06 Python
python中Genarator函数用法分析
2015/04/08 Python
Python中逗号的三种作用实例分析
2015/06/08 Python
python 全局变量的import机制介绍
2017/09/07 Python
python+opencv实现霍夫变换检测直线
2020/10/23 Python
python 提取key 为中文的json 串方法
2018/12/31 Python
python基于递归解决背包问题详解
2019/07/03 Python
python 多进程并行编程 ProcessPoolExecutor的实现
2019/10/11 Python
基于python实现把图片转换成素描
2019/11/13 Python
在keras 中获取张量 tensor 的维度大小实例
2020/06/10 Python
Nicole Miller官方网站:纽约女装品牌
2019/09/14 全球购物
铭立家具面试题
2012/12/06 面试题
十岁生日同学答谢词
2014/01/19 职场文书
美德少年事迹材料1000字
2014/08/21 职场文书
郭明义观后感
2015/06/08 职场文书
使用PDF.js渲染canvas实现预览pdf的效果示例
2021/04/17 Javascript
原生Javascript+HTML5一步步实现拖拽排序
2021/06/12 Javascript
详解TypeScript的基础类型
2022/02/18 Javascript