本文实例为大家分享了bootstrap table复杂操作,如何
生成外层表格
,如何填充表格内容,
供大家参考,具体内容如下1、先生成外层表格:
},{
title: '讲义',colspan: 3,align: 'center'
},{
title: '视频',{
title: '总完成情况',align: 'center'
}
],[
{
field: 'handoutCount',title: '讲义总数',sortable: true,{
field: 'handoutComCount',title: '完成数',align: 'center'
},{
field: 'handoutCountDegree',title: '完成率',align: 'center'
},{
field: 'videoCount',title: '视频总数',{
field: 'videoComCount',{
field: 'videoCountDegree',{
field: 'allCount',title: '总数',{
field: 'allComCount',title: '总完成数',{
field: 'allDegree',title: '总完成率',align: 'center'
}
]
]
});
2、生成展开之后的表格内容:
');
html.push('
');
html.push('
');
handoutColums.push({
field: 'handoutIndex',title: '编号',width: 150
},{
field: 'handoutName',title: '讲义名称',{
field: 'degree',title: '完成度',width: 150
});
videoColums.push({
field: 'videoIndex',{
field: 'videoName',title: '视频名称',width: 150
});
$.each(row,function (key,value) {
if(key=="handout"){
$.each(value,function(index,handout){
var row = {};
row['handoutIndex'] = index+1;
row['handoutName']=handout.handoutName;
row['degree']=handout.degree;
handoutData.push(row);
});
}
if(key=="video"){
$.each(value,video){
var row = {};
row['videoIndex']=index+1;
row['videoName']=video.videoName;
row['degree']=video.degree;
videoData.push(row);
});
}
});
return html.join('');
}
3、填充表格内容:
function initHandoutTable(colums,data,index){
$('#tableHandout'+index).bootstrapTable('destroy').bootstrapTable({
cache: false,height: 200,columns:colums,data:data
});
}
function initVideoTable(colums,index){
$('#tableVideo'+index).bootstrapTable('destroy').bootstrapTable({
cache: false,data:data
});
}
如果大家还想深入学习,可以点击进行学习,再为大家附两个精彩的专题:
原文链接:https://www.f2er.com/bootstrap/44720.html