为了账号安全,请及时绑定邮箱和手机立即绑定

如何使用bootstrap-table进行后端排序

/ 猿问

如何使用bootstrap-table进行后端排序

胡说叔叔 2019-06-29 19:19:21

如何使用bootstrap-table进行后端排序


查看完整描述

2 回答

?
largeQ

Bootstrap的后台数据绑定、特殊列处理及列的排序功能
1.数据绑定
一般做程序设计,很少是使用json文件直接绑定数据。基本上我们都是使用编程语言进行数据获取,并做数据绑定。
放置一个Table控件
<table id="table" ></table>
调用javascript的代码
<script >
$('#table').bootstrapTable({
url: 'tablejson.jsp', //数据绑定,后台的数据从jsp代码
search:true,
uniqueId:"Id",
pageSize:"5",
pageNumber:"1",
sidePagination:"client",
pagination:true,
height:'400',
columns: [
{
field: 'Id',
title: '中文'
}, {
field: 'Name',
title: 'Name'
}
, {
field: 'Desc',
title: 'Desc'
}
],
});
2.特殊列处理
在实际应用中,我们需要增加我们的特殊列,例如是操作列,看下列的js代码 增加了一个特殊列
{
field: '#',
title: 'control',formatter:function(value,row,index){
var del='<a href="Deletewww.bjldfw.comaction?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >删除</a>';
var updt='<a href="supdate.jsp?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >修改</a>';
var add='<a href="Include.jsp?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >增加</a>'
return del+" "+updt+" "+add;
}
}
js的代码修改为
<script >
$('#table').bootstrapTable({
url: 'tablejson.jsp', //数据绑定,后台的数据从jsp代码
search:true,
uniqueId:"Id",
pageSize:"5",
pageNumber:"1",
sidePagination:"client",
pagination:true,
height:'400',
columns: [

{
field: 'Id',
title: '中文'
}, {
field: 'Name',
title: 'Name'
}
, {
field: 'Desc',
title: 'Desc'
}
,
{
field: '#',
title: 'control',formatter:function(value,row,index){
var del='<a href="Deletewww.bjldfw.comaction?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >删除</a>';
var updt='<a href="supdate.jsp?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >修改</a>';
var add='<a href="Include.jsp?Id='+row.Id+'" rel="external nofollow" rel="external nofollow" >增加</a>'
return del+" "+updt+" "+add;
}
}
], }); 
3.列的排序,排序主要是在列中增加了一个属性
{
field: 'Name',
title: 'Name',<br><em id="mceDel">sortable:true</em>
}
以上就是JavaScript BootStrap Table后台数据绑定、特殊列处理、排序功能详解的详细内容


 




查看完整回答
反对 回复 2019-06-30
?
春华秋衣

table控件有filter的属性,可以过滤数据table.filtered :=false;table.filter := ...//过滤条件table.filtered := true;至于排序,可以用indexfieldnames设置一个字段名称就可以了

查看完整回答
反对 回复 2019-06-30

添加回答

回复

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信