轉帖|使用教程|編輯:龔雪|2016-02-06 09:16:16.000|閱讀 745 次
概述:C1Flexgrid在其他的平臺(WinForm, WPF)都支持了表頭過濾,那么wijmo5 flexgrid是否也支持?本文就來介紹如何簡單的實現wijmo5 flexgrid的過濾。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關鏈接:
C1Flexgrid在其他的平臺(WinForm, WPF)都支持了表頭過濾,那么wijmo5 flexgrid是否也支持?本文就來介紹如何簡單的實現wijmo5 flexgrid的過濾。
對于flexgrid控件的過濾操作,就需要FlexGridFilter擴展(wijmo.grid.filter.js)。這個過濾操作會出現在表格的column headers。點擊過濾的圖標,然后就會展示一個基于值的過濾界面。為了在flexgrid控件上實現一個類似Excel樣式的過濾,就需要創建FlexGridFilter的實例。首先需要復制文件(wijmo.grid.filter.js)到本地文件夾,然后在頁面引用這個文件。
<script src="wijmo.grid.filter.min.js" type="text/javascript"></script>
然后使用擴展創建FlexGridFilter的實例,然后傳遞表格作為參數給構造方法。代碼參考:
// create FlexGrid var flex = new wijmo.grid.FlexGrid('#gridElement'); // enable filtering on the FlexGrid var filter = new wijmo.grid.filter.FlexGridFilter(flex);
一旦設置這個,就會在ColumnHeader的位置出現過濾的圖標,如下:
Demo(純JavaScript文件)實現:
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉載自:慧都控件網