参考链接:bootstrap Table API 中文版

Bootstrap Table 选中某几行,获取其数据

Ajax传递数组,struts2接收数组

1、首先将复选框搞出来,<table data-single-select="true"> 属性,限制了只能单选。去除以后添加<th data-checkbox="true"></th>就可以添加复选框的功能了。
所以将复选框搞出来以后,就开始将获取到选择的数据值了。

 <table id="table" class="base_viewTable" data-toggle="table"
data-locale="zh-CN" data-ajax="tableRequest"
data-side-pagination="server" data-striped="true"
data-single-select="true" data-click-to-select="true"
data-pagination="true" data-pagination-first-text="首页"
data-pagination-pre-text="上一页" data-pagination-next-text="下一页"
data-pagination-last-text="末页">
<thead style="text-align: center;">
<tr>
<th data-checkbox="true"></th><!--复选框-->
<th data-field="id" data-formatter="indexFormatter" data-width="" data-halign="center" data-align="center">序号</th>
<th data-field="alias" data-halign="center" data-align="center">别名</th>
<th data-field="name" data-halign="center" data-align="center">名称</th>
<th data-field="paramter" data-halign="center" data-align="center" data-width="">参数</th>
<th data-field="status" data-formatter="statusFormatter" data-halign="center" data-align="center" data-halign="center" data-width="">状态</th>
<th data-field="updateTime" data-formatter="timeFormatter" data-halign="center" data-align="center" data-width="">时间</th>
<th data-formatter="optFormatter" data-halign="center" data-align="center" data-width="">操作</th>
</tr>
</thead>
</table>

效果图:

其他属性简单使用介绍:

更多其他属性,用的时候直接查看参考https://blog.csdn.net/liushuiziyouliu/article/details/80988458。此网友写的以及很详细了,这里不重复转载了。

<table data-single-select="true"> 属性,限制了只能单选。去除以后添加<th data-checkbox="true"></th>就可以添加复选框的功能了。
<table data-click-to-select="true">属性,单机每一行,可以选中行首的单选框或者复选框哦。
<th data-checkbox="true"></th>属性,复选框。可以进行批量操作哦。默认false不显示checkbox(复选框),设为true则显示,checkbox的每列宽度已固定。
<th data-radio="true"></th>属性,单选框,可以进行单条数据操作。默认false不显示radio(单选按钮),设为true则显示,radio宽度是固定的。
<th data-field="id"></th>属性,是每列的字段名,不是表头所显示的名字,通过这个字段名可以给其赋值,相当于key,表内唯一。
<th data-halign="center"></th>属性,table header(表头)的对齐方式,有:left(靠左)、right(靠右)、center(居中)。
<th data-align="center"></th>属性。每格内数据的对齐方式,有:left(靠左)、right(靠右)、center(居中)。
<th data-width=""></th>属性。每列的宽度。详细参考https://blog.csdn.net/liushuiziyouliu/article/details/80988458。
其他属性,用的时候直接查看参考https://blog.csdn.net/liushuiziyouliu/article/details/80988458。此网友写的以及很详细了,这里不重复转载了。

2、使用js处理获取到的复选框数据,然后使用ajax将数据传递给struts的action。

 function selectTen(){
//获取到本页选择的十条数据,使用getSelections即可获得,row是json格式的数据
var getSelectRows = $("#jobTable").bootstrapTable('getSelections', function (row) {
return row;
});
//console.log(getSelectRows);//控制台打印输出,方便观察值
var ids = new Array();//定义js数组用于存放自己所需的值
for(var i=;i<getSelectRows.length;i++){
ids[i] = getSelectRows[i].id;
}
//将表单元素数组或者对象序列化,是.serialize()的核心方法
var params = $.param({'ids' : ids},true);
//console.log(ids);//控制台打印输出,方便观察值
BootstrapDialog.show({
title : '批量操作确认提示',
message : '确定批量操作记录吗?',
buttons : [
{
cssClass : "btn-info",
label : '批量操作',
action : function(dialog) {
$.ajax({
type : 'post',
url : "xxxAction!xxxAllForever.action",
dataType : 'json',
traditional : true,
data : params,//将表单元素数组或者对象序列化的数组值传递到后台。
async : false,
error : function(request, textStatus,
errorThrown) {
fxShowAjaxError(request, textStatus,
errorThrown);
},
success : function(data) {
dialog.close();
$.alert(data.result);
searchJob();
}
});
}
}, {
cssClass : "base_btn-bluecyan",
label : '关闭',
action : function(dialog) {
dialog.close();
}
} ]
});
}

3、由于公司框架还是使用的struts,所以在action里面定义一个private ArrayList<Integer> ids;变量。
Action中List的定义:
通过使用param方法的处理,在action中ids的类型不管是数组还是list都能够正确的接收到这些id了。
ps:一定不要忘了setter方法! 我习惯性加的setter和getter方法。

private ArrayList<Integer> ids;
public ArrayList<Integer> getIds() {
return ids;
}
public void setIds(ArrayList<Integer> ids) {
this.ids = ids;
} public String xxxAllForever() {
//System.out.println(ids);
String result = null;
if(ids.size() > ) {
for(int i=;i<ids.size();i++) {
result = xxxService.stopxxx(ids.get(i));
}
}
dataMap.put("result", result);
return SUCCESS;
}

待续......

BootstrapTable,选中某几行,获取其数据并进行后台处理。以及其他的属性使用。的更多相关文章

  1. Zookeeper命令行操作(常用命令;客户端连接;查看znode路径;创建节点;获取znode数据,查看节点内容,设置节点内容,删除节点;监听znode事件;telnet连接zookeeper)

    8.1.常用命令 启动ZK服务 bin/zkServer.sh start 查看ZK服务状态 bin/zkServer.sh status 停止ZK服务 bin/zkServer.sh stop 重启 ...

  2. FineUI 选中多行获取行ID

    http://www.fineui.com/bbs/forum.php?mod=viewthread&tid=2506&page=1 /// <summary>       ...

  3. 在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了?

    在用easyui中做CRUD功能时,当删除一行或多行数据后再点击修改会提示你选中了多行,如何解决这个bug了? 在删除成功后,加上这句话就可以了:$("#dg").datagrid ...

  4. bootstrap-table前端实现多条件时间段查询数据

    实现思路:通过正则匹配到字段是否符合条件,时间段转换为时间戳比对. 这是大体的效果图: 页面的html代码 <div class="content-head mgb10"&g ...

  5. 【转】如何在Windows+VS2005使用最新静态libcurl 7.35.0获取网页数据,支持HTTPS

    地址: http://blog.csdn.net/hujkay作者:Jekkay Hu(34538980@qq.com)关键词:Windows,curl,ssl,  visual c++ 2005, ...

  6. jmeter 性能测试 JDBC Request (查询数据库获取数据库数据) 的使用

    JDBC Request 这个Sampler可以向数据库发送一个jdbc请求(sql语句),并获取返回的数据库数据进行操作.它经常需要和JDBC Connection Configuration配置原 ...

  7. solr与.net系列课程(四)solr查询参数的讲解与.net如何获取solr数据

    solr与.net系列课程(四)solr查询参数的讲解与.net如何获取solr数据 上一节我们完成了solr连接数据库,细心的朋友会发现一个问题,就是solr其实和语言没有任何关系,配置完成后任何语 ...

  8. 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来的Json数据写入数据库表中

    摘自:http://blog.csdn.net/mazhaojuan/article/details/8592015 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来 ...

  9. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

随机推荐

  1. 【转】Java 线程池

    什么是线程池? 线程池是指在初始化一个多线程应用程序过程中创建一个线程集合,然后在需要执行新的任务时重用这些线程而不是新建一个线程.线程池中线程的数量通常完全取决于可用内存数量和应用程序的需求.然而, ...

  2. [leetcode] 5.Longest Palindromic Substring-1

    开始觉得挺简单的 写完发现这个时间超限了: class Solution: def longestPalindrome(self, s: str) -> str: # longest palin ...

  3. mac查看git路径

    mac查看git路径

  4. python第六天

    深浅拷贝,元祖,字典 ,集合的定义以及基本操作方法 深浅拷贝 # 值拷贝:应用场景最多​值拷贝:先创建一个列表ls = [1, 'abc', [10]] 再定义 ls1 = ls  此处ls1会直接将 ...

  5. C语言的第一堂课

    感觉茂哥讲了很多,但是有些输入的语句还是没能记住 刚讲的都是概念,看来需要看一下表格,以及C语言的基础 有些意思还不能够理解 略显尴尬 回去把C语言书的各种概念理解一下……

  6. [JSOI2010]满汉全席 2-SAT

    https://www.luogu.org/problemnew/show/P4171 意识到图中只有两种不同的菜系:满和汉 并且检查员类似于一个约束,可以发现这就是一个2-sat模型,满和汉分别对应 ...

  7. Django web编程2 -- 编辑页面内容

    你将创建一些表单,让用户能够添加主题和条目,以及编辑既有的条目.你还将学习Django如何防范对基于表单的网页发起的常见攻击,这让你无需花太多时间考虑确保应用程序安全的问题. 然后,我们将实现一个用户 ...

  8. 浅议极大似然估计(MLE)背后的思想原理

    1. 概率思想与归纳思想 0x1:归纳推理思想 所谓归纳推理思想,即是由某类事物的部分对象具有某些特征,推出该类事物的全部对象都具有这些特征的推理.抽象地来说,由个别事实概括出一般结论的推理称为归纳推 ...

  9. font-spider问题【已解决】

    最近写一个项目,使用了引入的字体,然而字体太大,于是找解决方法,想要把字体压缩一下,然后找到了font-spider;font-spider使用方法这里就不多说了,网上一大把,主要是在node里面安装 ...

  10. 图解TCP/IP

    序言 ----