比較簡單的排序方法,對于小型的排序,在客戶端完成就可,麻煩客戶端,以來刷新麻煩來回傳數據,二來寫代碼也容易出錯.
調用方法:給datagrid的表頭的各個列標題添加onclick事件,然后調用sortTable('tblId', colIndex),分別傳入要排序的表或datagrid的id號,要排序的列的索引 例如
<asp:BoundColumn DataField="gb_id" HeaderText="&lt;div οnclick=&quot;sortTable('dgResult', 0)&quot;&gt;ID&lt;/div&gt;"></asp:BoundColumn>

?

??1function?compareMutiTRs(colIndex)
??2{
??3????return?function?compareTRs(tr1,?tr2)
??4????????????????{
??5????????????????????????var?value1;
??6????????????????????????var?value2;
??7????????????????????????//必須得考慮到?合并單元格的問題?
??8????????????????????????var?isNull?=?(tr2.cells[colIndex]==?null?||?tr1.cells[colIndex]?==??null)
??9????????????????????????if?(isNull)
?10????????????????????????{
?11????????????????????????????????value1?=?tr1.cells[0].firstChild.nodeValue;
?12????????????????????????????????value2?=?tr2.cells[0].firstChild.nodeValue;
?13???????????????????????}
?14???????????????????????else
?15???????????????????????{?
?16???????????????????????????????value1?=?tr1.cells[colIndex].firstChild.nodeValue;
?17???????????????????????????????value2?=?tr2.cells[colIndex].firstChild.nodeValue;
?18???????????????????????}
?19????????????????????????
?20????????????????????????if?(value1?>?value2)
?21????????????????????????{
?22????????????????????????????return?1;
?23????????????????????????}
?24????????????????????????else?if?(value1?<?value2)
?25????????????????????????{
?26????????????????????????????return?-1;
?27????????????????????????}
?28????????????????????????else
?29????????????????????????{
?30????????????????????????????return?0;
?31????????????????????????}
?32?????????????}
?33}
?34
?35var?lastCol?=?-1;
?36function?sortTable(tblId,?colIndex)
?37{
?38????var?tbl?=?document.getElementById(tblId);
?39????var?trs?=?tbl.rows;
?40????var?arrayTRs?=?new?Array();
?41????var?lastTR?=?null;
?42????var?start;
?43????var?end;
?44????
?45????var?flagUp?=?trs[0].cells.length?==?1;
?46????var?flagDown?=?trs[trs.length?-?1].cells.length?==?1
?47????if?(flagUp)//如果分頁提示在上
?48????{
?49????????????start?=?2;
?50????????????end?=?trs.length;
?51????}
?52????else?if?(flagDown)//如果分頁提示在下
?53????{
?54????????????start?=?1;
?55????????????end?=?trs.length?-1;??
?56????}
?57????else?if?(flagUp?&&?flagDown)//上下都有分頁提示
?58????{
?59????????????start?=?2;
?60????????????end?=?trs.length?-?1;?
?61????}
?62????else//上下都沒有分頁提示
?63????{
?64????????????start?=?1;
?65????????????end?=?trs.length;?
?66????}
?67????
?68????if?(trs[trs.length?-?2].cells.length?!=?trs[trs.length?-?1].cells.length)
?69????{
?70???????????lastTR?=?trs[trs.length?-?1];//把最后一行保存起來
?71????}
?72?????
?73????for?(var?i?=?start;?i?<?end;?i++)//
?74????{
?75????????????arrayTRs.push(trs[i]);
?76????}
?77????
?78????if?(colIndex?==?lastCol)
?79????{
?80????????????arrayTRs.reverse();
?81????}
?82????else
?83????{
?84????????????arrayTRs.sort(compareMutiTRs(colIndex));
?85????}
?86????
?87????var?fragment?=?document.createDocumentFragment();
?88????
?89????for?(var?j?=?0;?j?<?arrayTRs.length;?j++)
?90????{
?91????????????fragment.appendChild(arrayTRs[j]);
?92????}
?93????
?94????if?(lastTR?!=?null)
?95????{
?96????????????fragment.appendChild(lastTR);
?97????}
?98????
?99????tbl.tBodies[0].appendChild(fragment);
100????
101????lastCol?=?colIndex;
102}

轉載于:https://www.cnblogs.com/shenba/archive/2007/06/15/785285.html

總結

以上是生活随笔為你收集整理的最近学的用javascript给datagrid排序的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。