GridManager 具有表格數(shù)據(jù)導(dǎo)出功能,該功能為純前端實(shí)現(xiàn),對(duì)后端無(wú)依賴。
1.初始化時(shí)指定啟用導(dǎo)出功能。方式如下:
`<``table``></``table``>`
`var` `table = document.querySelector(``'table'``)`
`table.GM({`
`gridManagerName: ``'demo-export'``,`
`ajax_url: ``'http://www.lovejavascript.com/learnLinkManager/getLearnLinkList'``,`
`ajax_type: ``'POST'``,`
`supportAjaxPage: ``true``,`
`supportExport:``true``, ``// 配置啟用導(dǎo)出功能, 默認(rèn)即為true`
`exportConfig: {`
`// 導(dǎo)出的方式: 默認(rèn)為static`
`// 1.static: 前端靜態(tài)導(dǎo)出, 無(wú)需后端提供接口,該方式導(dǎo)出的文件并不完美。`
`// 2.blob: 通過(guò)后端接口返回二進(jìn)制流。`nodejs`可使用`js-xlsx`, `java`可使用 `org.apache.poi`生成二進(jìn)制流。`
`mode: ``'static'``,`
`// 導(dǎo)出的后綴名 , 默認(rèn)為`xls``
`suffix: ``'xls'``,`
`// 導(dǎo)出處理器函數(shù),該函數(shù)需要返回一個(gè)promise。當(dāng)`exportType`為`static`時(shí),該參數(shù)不生效。`
`handler: (fileName, query, pageData, sortData, selectedList) => {`
`// 需要通過(guò)promise中的resolve()返回二進(jìn)制流(blob),有兩種返回格式:`
`// 1.resolve(blob), 2.resolve({data: blob})`
`return` `new` `Promise(); `
`}`
`},`
`query: {pluginId: 1},`
`i18n: ``'en-us'``,`
`columnData: [`
`{`
`key: ``'name'``,`
`text: ``'name'`
`},{`
`key: ``'info'``,`
`text: ``'info'`
`},{`
`key: ``'url'``,`
`text: ``'url'``,`
`template: ``function``(url, rowObject){`
`return` `'<a style="color:#337ab7;" href="'``+url+``'" target="_blank">點(diǎn)擊跳轉(zhuǎn)</a>'``;`
`}`
`},{`
`key: ``'action'``,`
`remind: ``'the action'``,`
`width: ``'100px'``,`
`text: ``'操作'``,`
`template: ``function``(action, rowObject){`
`return` `'<a style="color:#337ab7;" href="javascript:;" onclick="testEditFN()" learnLink-name="'``+rowObject.name+``'">編輯</a>'``;`
`}`
`}]`
`});`
|
[在線執(zhí)行](http://runjs.cn/code/iqixtlhw)
2.渲染完成后,通過(guò) exportGridToXls 方法進(jìn)行調(diào)用
`GridManager.exportGridToXls(``'demo-export'``, fileName, onlyChecked)`
exportGridToXls方法,參數(shù)說(shuō)明:
table: 需要操作的table 或 table的gridManagerName值
fileName: 導(dǎo)出后使用的文件名,如果不設(shè)置將使用插件配置項(xiàng)gridManagerName。
onlyChecked:是否僅導(dǎo)出選中的項(xiàng), 默認(rèn)為false
注意事項(xiàng)
無(wú)法導(dǎo)出所有數(shù)據(jù),僅可對(duì)當(dāng)前顯示的數(shù)據(jù)進(jìn)行導(dǎo)出。如果存在導(dǎo)出全部的功能,需要自行實(shí)現(xiàn)。
導(dǎo)出功能的操作界面為右鍵菜單,如果在初始化時(shí)配置 supportMenu=false, 那么導(dǎo)出即使生效也無(wú)法通過(guò)界面操作。