bootstrap table分页模板和获取表中的ID方法-eolink官网

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

1.dao层

MyBatis映射

mapper.xml中

select * from TB_COMMUNICATION_DEVICE_TBL ORDER BY ${ordername} ${order}

mapper.java中

public List getTcdt(Mydata data);//分页查询

2.业务层service

/**

* 实现分页显示

@Override

public jsONObject getTcdt(Mydata data) {

// TODO Auto-generated method stub

JSONObject result=null;

List md=tbdao.getTcdt(data);

List resultList = new ArrayList() ;

//判断前台页面传回的值是不是空不是进行条件模糊查询

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() ;

for(int i=start;i

Tb_communication_device_tbl e=resultList.get(i);

md.add(e);

}

int total=0;

//存储值map中

Map map=new HashMap();

SimpleDateFormat sf=new SimpleDateFormat("yyyy-MM-dd");

//实现数据类型转换主要是日期类型转换成字符串

List 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.setWaterTemperatureAhttp://larm(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;

}

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 map=ActionContext.getContext().getSession();

map.put("list", list);//

map.put("offset2", offset);

map.put("limit1", limit);

return SUCCESS;

}

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属性，表格自动根据记录条数觉得表格高度

uniqueId: "id", //每一行的唯一标识，一般为主键列

showToggle: true, //是否显示详细视图和列表视图的切换按钮

cardView: false, //是否显示详细视图

detailView: true, //是否显示父子表

exportTypes: ['csv','txt','xml'],

exportDataType: "basic",

columns: [{

align: "cenqZDclksHter",

checkbox: true

{

field: 'stationNr',

title: '站号',

align: "center",

sortable: true,

editable: true

}, {

field: 'deviceClass',

title: '通讯设备类型',

align: "center",

sortable: true,

editable: true

}, {

field: 'batteryElectricQty',

title: '电池电量',

align: "center",

sortable: true,

editable: true

{

field: 'simcardNr',

title: 'SIM卡号',

align: "center",

sortable: true,

editable: true

{

field: 'wellDbk',

title: '统一编号',

sortable: true,

align: "center",

editable: true

{

field: 'installDate',

title: '安装日期',

sortable: true,

align: "center",

editable: true

{

field: 'operate',

title: '操作',

sortable: true,

align: "center",

editable: true,

formatter:function(value,row,index){

var e = '查看详情 ';

return e;

}

onCheckAll:function(rows){//全选中

var arr2=new Array();

var arr3=new Array();

arr2=$("#tb_departments").bootstrapTable('getSelections');

for (var i = 0; i < arr2.length; i++) {

arr3=arr2[i]

for(var s in arr3)

arr.push(arr3.stationNr);//添加数值到数组\

}

var n = []; //一个新的临时数组

for(var h = 0; h < arr.length; h++) //遍历当前数组

{

//如果当前数组的第i已经保存进了临时数组，那么跳过，

//否则把当前项push到临时数组里面

if (n.indexOf(arr[h]) == -1){

n.push(arr[h]);

}

arr=n

document.getElementById("ddd").value=arr;

onUncheckAll:function(rows){//全选不中

arr=[];//清空数组

document.getElementById("ddd").value=arr;

onUncheck:function(row){//不选中

stationNr2=row.stationNr; //取出id

arr.remove(stationNr2);

document.getElementById("ddd").value=arr;

onCheck:function(row){//选中

//alert("2")

stationNr2=row.stationNr; //取出id

arr.push(stationNr2);//添加数值到数组\

//去除重复元素

var s = arr.join(",")+",";

for(var i=0;i

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

onClickRow:function(row,$element){

$('.success').removeClass('success');

$($element).addClass('success');

stationNr2=row.stationNr;

arr.push(stationNr2);//添加数值到数组

//定义查询方法

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);

}

};

//去除重复元素

var s = arr.join(",")+",";

for(var i=0;i

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

}

});

};

//得到查询的参数

oTableInit.queryParams = function (params) {

var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，action也需要改成一样的

limit: params.limit, //页面大小

offset: params.offset, //页码

order: params.order,

ordername: params.sort,//返回排序列名

//pageSize: params.pageSize, //页面大小

//pageNumber: params.pageNumber, //页码

departmentname: $("#departmentname").val(),//返回查询条件

wells: $("#wells").val(),

};

return temp;

};

return oTableInit;

};

var ButtonInit = function () {

var oInit = new Object();

var postdata = {};

oInit.Init = function () {

//初始化页面上面的按钮事件

};

return oInit;

};

以上所述是给大家介绍的bootstrap table分页模板和获取表中的ID，对Get请求无效的问题，希望对大家有所帮助，如果大家有任何疑问请给我留言，会及时回复大家的。在此也非常感谢大家对我们网站的支持！

Tb_communication_device_tbl e=resultList.get(i);

md.add(e);

}

int total=0;

//存储值map中

Map map=new HashMap();

SimpleDateFormat sf=new SimpleDateFormat("yyyy-MM-dd");

//实现数据类型转换主要是日期类型转换成字符串

List 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.setWaterTemperatureAhttp://larm(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;

}

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 map=ActionContext.getContext().getSession();

map.put("list", list);//

map.put("offset2", offset);

map.put("limit1", limit);

return SUCCESS;

}

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属性，表格自动根据记录条数觉得表格高度

uniqueId: "id", //每一行的唯一标识，一般为主键列

showToggle: true, //是否显示详细视图和列表视图的切换按钮

cardView: false, //是否显示详细视图

detailView: true, //是否显示父子表

exportTypes: ['csv','txt','xml'],

exportDataType: "basic",

columns: [{

align: "cenqZDclksHter",

checkbox: true

{

field: 'stationNr',

title: '站号',

align: "center",

sortable: true,

editable: true

}, {

field: 'deviceClass',

title: '通讯设备类型',

align: "center",

sortable: true,

editable: true

}, {

field: 'batteryElectricQty',

title: '电池电量',

align: "center",

sortable: true,

editable: true

{

field: 'simcardNr',

title: 'SIM卡号',

align: "center",

sortable: true,

editable: true

{

field: 'wellDbk',

title: '统一编号',

sortable: true,

align: "center",

editable: true

{

field: 'installDate',

title: '安装日期',

sortable: true,

align: "center",

editable: true

{

field: 'operate',

title: '操作',

sortable: true,

align: "center",

editable: true,

formatter:function(value,row,index){

var e = '查看详情 ';

return e;

}

onCheckAll:function(rows){//全选中

var arr2=new Array();

var arr3=new Array();

arr2=$("#tb_departments").bootstrapTable('getSelections');

for (var i = 0; i < arr2.length; i++) {

arr3=arr2[i]

for(var s in arr3)

arr.push(arr3.stationNr);//添加数值到数组\

}

var n = []; //一个新的临时数组

for(var h = 0; h < arr.length; h++) //遍历当前数组

{

//如果当前数组的第i已经保存进了临时数组，那么跳过，

//否则把当前项push到临时数组里面

if (n.indexOf(arr[h]) == -1){

n.push(arr[h]);

}

arr=n

document.getElementById("ddd").value=arr;

onUncheckAll:function(rows){//全选不中

arr=[];//清空数组

document.getElementById("ddd").value=arr;

onUncheck:function(row){//不选中

stationNr2=row.stationNr; //取出id

arr.remove(stationNr2);

document.getElementById("ddd").value=arr;

onCheck:function(row){//选中

//alert("2")

stationNr2=row.stationNr; //取出id

arr.push(stationNr2);//添加数值到数组\

//去除重复元素

var s = arr.join(",")+",";

for(var i=0;i

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

onClickRow:function(row,$element){

$('.success').removeClass('success');

$($element).addClass('success');

stationNr2=row.stationNr;

arr.push(stationNr2);//添加数值到数组

//定义查询方法

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);

}

};

//去除重复元素

var s = arr.join(",")+",";

for(var i=0;i

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

}

});

};

//得到查询的参数

oTableInit.queryParams = function (params) {

var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，action也需要改成一样的

limit: params.limit, //页面大小

offset: params.offset, //页码

order: params.order,

ordername: params.sort,//返回排序列名

//pageSize: params.pageSize, //页面大小

//pageNumber: params.pageNumber, //页码

departmentname: $("#departmentname").val(),//返回查询条件

wells: $("#wells").val(),

};

return temp;

};

return oTableInit;

};

var ButtonInit = function () {

var oInit = new Object();

var postdata = {};

oInit.Init = function () {

//初始化页面上面的按钮事件

};

return oInit;

};

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

onClickRow:function(row,$element){

$('.success').removeClass('success');

$($element).addClass('success');

stationNr2=row.stationNr;

arr.push(stationNr2);//添加数值到数组

//定义查询方法

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);

}

};

//去除重复元素

var s = arr.join(",")+",";

for(var i=0;i

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

}

});

};

//得到查询的参数

oTableInit.queryParams = function (params) {

var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，action也需要改成一样的

limit: params.limit, //页面大小

offset: params.offset, //页码

order: params.order,

ordername: params.sort,//返回排序列名

//pageSize: params.pageSize, //页面大小

//pageNumber: params.pageNumber, //页码

departmentname: $("#departmentname").val(),//返回查询条件

wells: $("#wells").val(),

};

return temp;

};

return oTableInit;

};

var ButtonInit = function () {

var oInit = new Object();

var postdata = {};

oInit.Init = function () {

//初始化页面上面的按钮事件

};

return oInit;

};

if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>-1) {

arr.remove(arr[i]);

document.getElementById("ddd").value=arr;

break;

}

document.getElementById("ddd").value=arr;

}

});

};

//得到查询的参数

oTableInit.queryParams = function (params) {

var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，action也需要改成一样的

limit: params.limit, //页面大小

offset: params.offset, //页码

order: params.order,

ordername: params.sort,//返回排序列名

//pageSize: params.pageSize, //页面大小

//pageNumber: params.pageNumber, //页码

departmentname: $("#departmentname").val(),//返回查询条件

wells: $("#wells").val(),

};

return temp;

};

return oTableInit;

};

var ButtonInit = function () {

var oInit = new Object();

var postdata = {};

oInit.Init = function () {

//初始化页面上面的按钮事件

};

return oInit;

};

zookeeper python接口实例详解

371 2023-06-19

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

java中的接口是类吗

vue项目接口域名动态的获取方法

zookeeper python接口实例详解

推荐文章

接口调用是什么意思？几种常用接口调用方式

接口设计原则

8款在线 API 接口文档管理工具

api管理系统是什么？

什么是接口调试？接口调试的步骤有哪些？

api 接口管理系统有哪些？

接口测试有几种测试方法

API文档生成工具有哪些？

微服务和api网关区别

交换机配置步骤

最近发表

热评文章

在线接口文档管理工具推荐，支持在线测试，HTTP接口

开源的在线接口文档wiki工具Mindoc的介绍与使

如何优雅的进行接口设计？接口设计的六大原则是什么？

什么是API测试,api检测公司

软件接口设计怎么做？前后端分离软件接口设计思路

接口管理平台推荐，几大接口管理平台总有一款适合你！