目標(biāo):實(shí)現(xiàn)一個(gè)類似于Excel功能的Grid數(shù)據(jù)維護(hù)功能,并且就地編輯在乎的是Cell編輯而不是行編輯
公司主營業(yè)務(wù):成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站、移動(dòng)網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。成都創(chuàng)新互聯(lián)公司是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶帶來驚喜。成都創(chuàng)新互聯(lián)公司推出雨山免費(fèi)做網(wǎng)站回饋大家。
候選者:easy-ui之datagrid, jqgrid, flexigrid
使用環(huán)境:jquery, bootstrap,bootstrap-datepicker
特性要求:
1. 列排序和列寬改變
2. 行顏色改變和樣式
3. 表頭排序,表頭改變順序
4. cell inline editing
5. 易于定制和擴(kuò)展
上面上個(gè)沒有沒有一個(gè)本身就能滿足所有的功能
其中easy-ui datagrid缺乏列重排序和Cell edit的功能
jqgrid缺乏列重排
flexgrid缺乏就地編輯的功能
幸運(yùn)的是它們每一個(gè)自己改改都能實(shí)現(xiàn)自己的功能,其中flexgrid個(gè)人覺得最輕量級最靈活,所以給他配上in-place edit插件,然后利用它的process回調(diào)函數(shù),所有功能特性全部滿足了,主要是干干凈凈,看著就舒服。而且它的UI非常像EXTJS,個(gè)人非常喜歡,還有是表頭的拖拽功能,隱藏顯示功能都非常要用。
jqgrid 2008年就搞過,功能非常豐富,它處理復(fù)雜Grid,比如嵌套grid,組合表頭都很棒,但是它很多東西嚴(yán)重依賴JQuery UI來搞,皮膚都是Jquery Ui的,如果項(xiàng)目中用了JQuery UI,那么使用它作為JQuery UI在Grid方面的功能實(shí)現(xiàn),是非常棒的;
EasyUI是近年流行的JQuery下類ExtJS的UI庫,它提供了完整的一套UI組件,并且日趨成熟,如果整個(gè)系統(tǒng)都是由EasyUI做的,那么用EasyUI也是很棒的,但是我卻不喜歡它默認(rèn)的風(fēng)格,覺得某些方面不如EXTJS那么細(xì)膩。
排序的關(guān)鍵是這兩個(gè)屬性:?sortname:?'eight',?????//默認(rèn)表格加載時(shí)根據(jù)eight列排序
sortorder:?'asc',???????//默認(rèn)的排序方式,跟數(shù)據(jù)庫的asc,desc一樣
加上sortable:true就能排序,并不是加在colModel中。
在jquery里可以直接用isNaN(),因?yàn)樗荍avaScript的類庫。是由JavaScript語言寫的。
例如:
script type="text/javascript"
$(document).ready(function(){
alert(isNaN($('#id').val()));
});
/script可以直接使用