• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > bootstrap table分页模板和获取表中的ID方法

bootstrap table分页模板和获取表中的ID方法

作者:liuweiyan1991 字体:[增加 减小] 来源:互联网 时间:2017-05-11

liuweiyan1991通过本文主要向大家介绍了bootstrap table模板,bootstrap table,bootstrap table样式,bootstraptable api,bootstrap table插件等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

1.dao层

   MyBatis映射

   mapper.xml中

 <select id="getTcdt" parameterType="com.ls.entity.Mydata" resultMap="BaseResultMap">
  select * from TB_COMMUNICATION_DEVICE_TBL ORDER BY ${ordername} ${order}
 </select>
</div>

   mapper.java中

  public List<Tb_communication_device_tbl> getTcdt(Mydata data);//分页查询
</div>

2.业务层service

/**
  * 实现分页显示
  */
  @Override
  public JSONObject getTcdt(Mydata data) {
    // TODO Auto-generated method stub
    JSONObject result=null;
    List<Tb_communication_device_tbl> md=tbdao.getTcdt(data);
    List<Tb_communication_device_tbl> resultList = new ArrayList<Tb_communication_device_tbl>() ;
    //判断前台页面传回的值是不是空不是进行条件模糊查询
        if(null!=data.getStationNr() && !data.getStationNr().trim().equals("")||data.getWellDbk()!=null&&data.getWellDbk().trim().equals("")){
      for(Tb_communication_device_tbl user :md){
        if(user.getStationNr().indexOf(data.getStationNr()) >= 0){
          resultList.add(user);
        }
      }
    }else{
      resultList = md;
    }
    //获取分页数据
    int pageNumber = null!=data.getDangqian() ? Integer.parseInt(data.getDangqian()) : 0;
    int pageSize = null!=data.getFrist() ? Integer.parseInt(data.getFrist()) : 10;
    int start = (pageNumber) * pageSize;//计算开始记录数
    int end = start+pageSize;//计算结束记录数
    md= new ArrayList<Tb_communication_device_tbl>() ;
    for(int i=start;i<end && i<resultList.size();i++){
      Tb_communication_device_tbl e=resultList.get(i);
     md.add(e);
         }
    int total=0;
    //存储值map中
    Map<String, Object> map=new HashMap<String, Object>();
    SimpleDateFormat sf=new SimpleDateFormat("yyyy-MM-dd");
      //实现数据类型转换主要是日期类型转换成字符串
            List<Mydate> list=new ArrayList<>(); 
      for (int i = 0; i < md.size(); i++) {
        Mydate my=new Mydate();
        my.setAlarmVoltage(md.get(i).getAlarmVoltage());
        my.setBatteryElectricQty(md.get(i).getBatteryElectricQty());
        my.setInstallDate(sf.format(md.get(i).getInstallDate()));
        //my(md.get(i)));
        my.setDeviceClass((md.get(i).getDeviceClass()));
        my.setLevelElevationAlarm((md.get(i).getLevelElevationAlarm()));
        my.setNewWellDbk(md.get(i).getNewWellDbk());
        my.setOperationDate(sf.format(md.get(i).getOperationDate()));
        my.setReadoutFrequency(md.get(i).getReadoutFrequency());
        my.setRemark(md.get(i).getRemark());
        my.setReturenValueBln(md.get(i).getReturenValueBln());
        /*my.setSendingcycle(md.get(i).getSendingcycle());
        my.setSendingstarttime(md.get(i).getSendingstarttime());*/
        my.setShowingBln(md.get(i).getShowingBln());
        my.setSignalAlarm(md.get(i).getSignalAlarm());
        my.setSimcardNr(md.get(i).getSimcardNr());
        my.setStationNr(md.get(i).getStationNr());
        my.setTransmittingFrequency(md.get(i).getTransmittingFrequency());
        my.setUserId(md.get(i).getUserId());
        my.setWaterTemperatureAlarm(md.get(i).getWaterTemperatureAlarm());
        my.setWellDbk(md.get(i).getWellDbk());
        my.setWorkingStatus(md.get(i).getWorkingStatus());
        list.add(my);
      }
      map.put("total", resultList.size());
      map.put("rows", list);
      //存入返回值中
      result=JSONObject.fromObject(map);
    return result;
  }
</div>

3.action层        

 public String execute(){
      String pageNO=null;
      String pageSize=null;
      if(offset==null||limit==null){
       pageNO ="0";
       pageSize="10";
      }else{
         pageNO =offset;
         pageSize=limit;
      }
        //给对象赋值
        Mydata data=new Mydata();
      data.setDangqian(pageNO);
      data.setFrist(pageSize);
      //System.out.println(wells);
      data.setStationNr(departmentname);
      data.setWellDbk(wells);
      data.setOrder(order);
      //点击列头获取属性因为属性和数据库列名不一样所以排序要进行修改列名
      if(ordername==null){
        data.setOrdername("STATION_NR");
        }
      if(ordername!=null){
      if(ordername.equals("deviceClass")){
        data.setOrdername("DEVICE_CLASS");
      }
      if(ordername.equals("stationNr")){
        data.setOrdername("STATION_NR");
      }
      if(ordername.equals("batteryElectricQty")){
        data.setOrdername("BATTERY_ELECTRIC_QTY");
      }
      if(ordername.equals("simcardNr")){
        data.setOrdername("SIMCARD_NR");
      }
      if(ordername.equals("wellDbk")){
        data.setOrdername("WELL_DBK");
      }
      if(ordername.equals("installDate")){
        data.setOrdername("INSTALL_DATE");
      }
      }
    result=tb_communication_device_tblservice.getTcdt(data);
    list=tB_MONITOR_WELL_TBLservice.getTmwt();//获取外键的值
    Map<String, Object> map=ActionContext.getContext().getSession();
    map.put("list", list);//
    map.put("offset2", offset);
    map.put("limit1", limit);
    return SUCCESS;
  }
</div>

js文件

 var TableInit = function () {
      var oTableInit = new Object();
      var stationNr=null;
      var stationNr2=null;
      var arr=new Array();
      var arr1=new Array();
      //定义查询方法
      Array.prototype.indexOf = function(val) {
         for (var i = 0; i < this.length; i++) {
           if (this[i] == val) return i;
         }
         return -1;
       };
       Array.prototype.remove = function(val) {
         var index = this.indexOf(val);
         if (index > -1) {
           this.splice(index, 1);
         }
       };
      //初始化Table
      oTableInit.Init = function () {
        $('#tb_departments').bootstrapTable({
           url: 'tcdtaction', //请求后台的URL(*)
           method: 'get', //请求方式(*)
           toolbar: '#toolbar', //工具按钮用哪个容器
           striped: false, //是否显示行间隔色
           cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
           pagination: true, //是否显示分页(*)
           sortable: true, //是否启用排序
           sortOrder: "asc", //排序方式
           queryParams: oTableInit.queryParams, //传递参数(*)
           sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
           pageNumber: 1, //初始化加载第一页,默认第一页
           pageSize: 10, //每页的记录行数(*)
           pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
           search: false, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
           strictSearch: false,//设置为 true启用 全匹配搜索,否则为模糊搜索
           // showExport表示是否显示导出的按钮,exportDataType表示导出的模式是当前页、所有数据还是选中数据。
           sortable:true,//设置为false 将禁止所有列的排序
           searchOnEnterKey:true,//设置为 true时,按回车触发搜索方法,否则自动触发搜索方法
           showColumns: true, //是否显示所有的列
           showRefresh: true, //是否显示刷新按钮
           showExport: true,//是否显示导出
           showpaginationswitch:true,//是否显示 数据条数选择框
           minimumCountColumns: 2, //最少允许的列数
           clickToSelect: true, //是否启用点击选中行
           height: 532, //行高,如果没有设置height属性,表格自动根据记



 
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • bootstrap table分页模板和获取表中的ID方法

相关文章

  • 2017-05-11JavaScript实现的商品抢购倒计时功能示例
  • 2017-05-11vue中用动态组件实现选项卡切换效果
  • 2017-05-11js正则表达式验证密码强度【推荐】
  • 2017-05-11node.js的事件机制
  • 2017-05-11JS表格组件神器bootstrap table使用指南详解
  • 2017-05-11javascript 中关于array的常用方法详解
  • 2017-05-11setTimeout学习小结
  • 2017-05-11BootStrap Datetimepicker 汉化的实现代码
  • 2017-05-11Android中Okhttp3实现上传多张图片同时传递参数
  • 2017-05-11JS百度地图搜索悬浮窗功能

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • JS 设计模式--策略模式
    • javascript数据类型详解
    • 详解node.js搭建代理服务器请求数据
    • 原生js轮播(仿慕课网)
    • Jquery与Bootstrap实现后台管理页面增删改查功能示例
    • 基于vuejs实现一个todolist项目
    • jQuery实现页面倒计时并刷新效果
    • Node.js查找当前目录下文件夹实例代码
    • jQuery插件zTree实现获取一级节点数据的方法
    • javascript设计模式之模块模式学习笔记

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有