javascript表格控件:Chgrid,簡化型
更新時間:2007年04月07日 00:00:00 作者:
本著自由共享的精神,把代碼帖出來,同時大家也可以一起來測試以及添加新功能,請大家根據(jù)網(wǎng)友提出的問題,把自己修改好的版本都帖出來跟在下面,最后作為一款比較全面的表格軟件。
Chgrid的簡單功能介紹:
1:支持自定義排序
2:支持列寬度的拖放
3:支持自定義函數(shù)
4:支持分頁
5:支持自動編號
6:多瀏覽器支持,支持ie6,ie7,ff,opera
7:div布局
已知問題:
1:由于使用的div布局,如果使用margin或者padding會改變定義的列寬度,所以目前文字只能居中或者靠左或靠右,不能使用padding控制位置
目前解決辦法是可以在每個div里面再附加一個div,用這個div的margin屬性來控制其位置。
2:內(nèi)容在超出容器寬度的時候,拖動會有點小問題,。
怎樣修改樣式:
如果不改變風(fēng)格,大家只要對如下部分代碼調(diào)整就可以
Chgrid_column0{ width:20px;}
.Chgrid_column1{ width:100px;}
.Chgrid_column2{ width:80px;}
.Chgrid_column3{ width:120px;}
.Chgrid_column4{ width:100px;}
每多一列就再加一行比如.Chgrid_column5{ width:100px;}
注意:最后一列是不用定義寬度的,程序會自動調(diào)整
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
其它優(yōu)秀的grid控件參考:
http://www.activewidgets.com
http://www.yui-ext.com/deploy/ext-1.0-alpha3/docs/
請千萬不要把我這款控件跟它們比較,差距較大,不過我也有優(yōu)勢,使用起來比較簡單,速度也快:)
本來想多加點數(shù)據(jù),結(jié)果發(fā)現(xiàn)超過限制了,大家測試的時候自己多搞點數(shù)據(jù)測試其速度如何。
[ 本帖最后由 cityvoice 于 2007-3-15 16:52 編輯 ]
Chgrid的簡單功能介紹:
1:支持自定義排序
2:支持列寬度的拖放
3:支持自定義函數(shù)
4:支持分頁
5:支持自動編號
6:多瀏覽器支持,支持ie6,ie7,ff,opera
7:div布局
已知問題:
1:由于使用的div布局,如果使用margin或者padding會改變定義的列寬度,所以目前文字只能居中或者靠左或靠右,不能使用padding控制位置
目前解決辦法是可以在每個div里面再附加一個div,用這個div的margin屬性來控制其位置。
2:內(nèi)容在超出容器寬度的時候,拖動會有點小問題,。
怎樣修改樣式:
如果不改變風(fēng)格,大家只要對如下部分代碼調(diào)整就可以
Chgrid_column0{ width:20px;}
.Chgrid_column1{ width:100px;}
.Chgrid_column2{ width:80px;}
.Chgrid_column3{ width:120px;}
.Chgrid_column4{ width:100px;}
每多一列就再加一行比如.Chgrid_column5{ width:100px;}
注意:最后一列是不用定義寬度的,程序會自動調(diào)整
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
其它優(yōu)秀的grid控件參考:
http://www.activewidgets.com
http://www.yui-ext.com/deploy/ext-1.0-alpha3/docs/
請千萬不要把我這款控件跟它們比較,差距較大,不過我也有優(yōu)勢,使用起來比較簡單,速度也快:)
本來想多加點數(shù)據(jù),結(jié)果發(fā)現(xiàn)超過限制了,大家測試的時候自己多搞點數(shù)據(jù)測試其速度如何。
[ 本帖最后由 cityvoice 于 2007-3-15 16:52 編輯 ]
相關(guān)文章
javascript實現(xiàn)簡單的可隨機(jī)變色網(wǎng)頁計算器示例
這篇文章主要介紹了javascript實現(xiàn)簡單的可隨機(jī)變色網(wǎng)頁計算器,具有基本的四則運算與背景色隨機(jī)變換功能,需要的朋友可以參考下2016-12-12js實現(xiàn)鼠標(biāo)點擊左上角滑動菜單效果代碼
這篇文章主要介紹了js實現(xiàn)鼠標(biāo)點擊左上角滑動菜單效果代碼,涉及JavaScript基于鼠標(biāo)事件動態(tài)變換頁面元素樣式的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09兼容多瀏覽器的iframe自適應(yīng)高度(ie8 、谷歌瀏覽器4.0和 firefox3.5.3)
iframe在ie8 、谷歌瀏覽器4.0和 firefox3.5.3均成功自適應(yīng)高度.2009-11-11JavaScript實現(xiàn)微信小程序打卡時鐘項目實例
這篇文章主要為大家介紹了JavaScript實現(xiàn)微信小程序打卡時鐘項目實例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-04-04JavaScript的常見兼容問題及相關(guān)解決方法(chrome/IE/firefox)
本篇文章只要是對JavaScript的常見兼容問題及相關(guān)解決方法(chrome/IE/firefox)進(jìn)行了詳細(xì)的介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12