获取 所在行索引 总行数 选中的行数据 所有数据
//所在行索引
formatter: function(value, row, index) { index }
onClickCell: function(field, value, row, $element) {var index = $element.parent().data('index');}
//总行数
var rows= $('#table_add').bootstrapTable('getData').length;
//数据
var data = $("#" + tableId).bootstrapTable(('getData')); // 所有数据
var rowsData = $("#bootstrap-table").bootstrapTable('getSelections'); //选中的行数据
var data = $("#table").bootstrapTable('getData')[index]; //根据行索引获取行数据
列表 后台格式为 TableDataInfo
@PostMapping("/list")
public TableDataInfo addList(WholeDepartment wholeDepartment) {
return getDataTable(list);
}
$.table.init(options);
$.treeTable.init(options);
$.modal.openOptions(options); // 跳出新窗口
$.table.search()
弹出窗口 关闭窗口
//关闭弹窗的窗口
parent.layer.closeAll();
//确定按钮
submitHandler()
//跳出新窗口
$.modal.open("案例", "/beforehand/casesIndicators/caseSelect");
$.modal.openIndex('绩效年度', ctx+"system/user/yearChoosing", '280', '183');
// 跳出新窗口
var options = {
title: '公告详情',
width: "1100",
height: "760",
url: prefix+"/detail/"+guid
};
$.modal.openOptions(options);
1.tableId
<table id="bootstrap-table" data-mobile-responsive="true" style="white-space: nowrap;"></table>
3.控制器
@PostMapping("/list")
@ResponseBody
public TableDataInfo list(EvaluationFundingPayDetail evaluationFundingPayDetail)
{
startPage();
List<EvaluationFundingPayDetail> list = evaluationFundingPayDetailService.selectEvaluationFundingPayDetailList(evaluationFundingPayDetail);
return getDataTable(list);
}
2.JS
//正常列表
$.table.init(options);
$(function() {
var options = {
url: ctx + "statistics/selectUnit",
//双击
onDblClickRow:function(row,$element){
createMenuItem(ctx+"gather/selfEvaluation/detail/"+row.projectId,"评价详情")
},
columns: [
{
checkbox: true
},
{
field : 'unit_name',
title : '单位名称'
},
{
field : 'projectNum',
title : '项目数量'
},
{
field : 'taskNum',
title : '任务下达情况',
sortable: true
},
{
field : 'applyNum',
title : '绩效申报情况',
visible: true
},
{
field : 'monitorNum',
title : '监控申报情况'
},
{
field : 'evaluationNum',
title : '评价申报情况'
}
]
};
$.table.init(options);
});
//树形列表
$.treeTable.init(options);
$(function() {
var options = {
url: prefix + "/list",
code: "deptId",
parentCode: "parentId",
uniqueId: "deptId",
expandAll: false,
expandFirst: true,
showSearch: false,
showRefresh: false,
showToggle: false,
showColumns: false,
odalName: "项目主管部门",
columns: [
{
field: 'selectItem',
radio: true
},
{
field : 'code',
title : '部门代码',
formatter: function(value, row, index) {
if ($.common.isEmpty(row.icon)) {
return row.code;
} else {
return '<i class="' + row.icon + '"></i> <span class="nav-label">' + row.code + '</span>';
}
]
};
$.treeTable.init(options);
});
双击
//写在option里
onDblClickRow:function(row,$element){
createMenuItem(ctx+"gather/selfEvaluation/detail/"+row.projectId,"评价详情")
},
不换行 去掉四个图标
//加在table里
style="white-space: nowrap;"
//加在option里
showExport: false,
showSearch: false,
showRefresh: false,
showToggle: false,
showColumns: false,
pagination : false,//是否分页
singleSelect : true, //设置单选
操作按钮与下拉框
下拉框的回显 依靠 select = “selectd”
//编辑删除按钮
formatter: function(value, row, index) {
var actions = [];
actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" οnclick="$.operate.edit(\'' + row.evaluationTargetCompletionGuid + '\')"><i class="fa fa-edit"></i>编辑</a> ');
actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" οnclick="$.operate.remove(\'' + row.evaluationTargetCompletionGuid + '\')"><i class="fa fa-remove"></i>删除</a>');
return actions.join('');
}
//增加行按钮 删除行按钮
formatter:function (value, row, index) {
var actions = [];
actions.push('<i style="color:red;vertical-align: middle" οnclick="deleteRow2(\'bootstrap-table\',' + index + ')" class="glyphicon glyphicon-trash"></i>');
actions.push(' <i style="color:green;vertical-align: middle" οnclick="insertRow2(\'bootstrap-table\',' + index + ')" class="glyphicon glyphicon-plus-sign"></i></div>');
return actions;
}
//填报页面三级指标最右边蓝色搜索框 和点击出现页面
if (i == 2) {
columnOption.formatter = function (value, row, index) {
if (row.type && row.type == '用户指标' && value != null) {
value = '<i style="float:left" type="primary" class="glyphicon glyphicon-user">' + value + '</i>';
} else if (value) {
value = '<div style="float:left">' + value + '</div>'
}
var values = [];
values.push(value);
if (getRowEdited(index) && indicatorColumnEdited[1])
values.push('<i οnclick="indicator_out_showModel(\'' + row.indicatorOne + '\',\'' + row.indicatorTwo + '\')" data-toggle="modal" data-target="#myModal5" class="glyphicon glyphicon-list" style="color:#2e82ff;float:right" ></i>');
return values.join('');
}
}
//下拉框
//1.formatter
formatter:initAchieValueTypeSelect
//2。显示下拉框与回显
/*下拉框回显*/
function initSelect(value, row, index){
var field = this.field;
var strHtml = "";
if(value == "是"){
strHtml =
"<select οnchange='reSetSelect("+index+",\"" + field + "\",this.options[this.options.selectedIndex].value)'>" +
"<option value=' '> </option>" +
"<option value='是' selected >是</option>" +
"<option value='否'>否</option>" +
"</select>";
}else if(value == "否") {
strHtml =
"<select οnchange='reSetSelect("+index+",\"" + field + "\",this.options[this.options.selectedIndex].value)'>" +
"<option value=' '> </option>" +
"<option value='是'>是</option>" +
"<option value='否' selected >否</option>" +
"</select>";
}else {
strHtml =
"<select οnchange='reSetSelect("+index+",\"" + field + "\",this.options[this.options.selectedIndex].value)'>" +
"<option value=' ' selected> </option>" +
"<option value='是'>是</option>" +
"<option value='否'>否</option>" +
"</select>";
}
return strHtml;
}
//3.下拉框选择值发生变化
function reSetSelect(index,field,value) {
$('#bootstrap-table').bootstrapTable('updateCell', {
index: index,
field: field,
value: value
});
var datas = $('#bootstrap-table').bootstrapTable('getData', true);
mergeTable2(datas,"bootstrap-table");
}