承接第一篇,這篇主要說明bootstrapTable.js常用到的方法。
//載入資料
$table.bootstrapTable('load', getRandomData());
//改變Table高度
$table.bootstrapTable('resetView', { height:450 });
//從最前面加資料
$table.bootstrapTable('prepend', getRandomData());
//從最後面加資料
$table.bootstrapTable('append', getRandomData());
//移動到最後面
$table.bootstrapTable('scrollTo', 'bottom');
//移動到top100px處
$table.bootstrapTable('scrollTo', 100);
//重新整理畫面
$table.bootstrapTable('resetView');
//取得所有資料
console.table($table.bootstrapTable('getData'));
//直接跳到第5頁
$table.bootstrapTable('selectPage', 5);
//回到前一頁(自行實作換頁按鈕)
$table.bootstrapTable('prevPage');
//到下一頁(自行時做換頁按鈕)
$table.bootstrapTable('nextPage');
//顯示/隱藏欄位
$table.bootstrapTable('hideColumn', 'name');
$table.bootstrapTable('showColumn', 'name');
//顯示/隱藏Loading
$table.bootstrapTable('showLoading');
$table.bootstrapTable('hideLoading');
//顯示/隱藏Row
$table.bootstrapTable('showRow', {index: 1});
$table.bootstrapTable('hideRow', {index: 1});
//表格與名片式呈現切換
$table.bootstrapTable('toggleView');
//增加資料
$table.bootstrapTable('insertRow', {
index: 10,
row: {
id: 'newId',
name: 'newItem',
mailAddress: '$1000'
}
});
//修改資料-方法1
$table.bootstrapTable('updateRow', {
index: 1,
row: {
id: 'id001',
name: 'updateName',
mailAddress: '$6666'
}
});
//修改資料-方法2
$table.bootstrapTable('updateByUniqueId', {
id: 'id001',
row: {
name: 'updateName',
mailAddress: '$$6666'
}
});