大学IT网 - 最懂大学生的IT学习网站! QQ资料交流群:367606806
当前位置:大学IT网 > ASP.NET技巧 > DataGrid GridView 单页javascript

DataGrid GridView 单页javascript

关键词:表头排序DataGridGridViewjavasc  阅读(650) 赞(16)

[摘要]本文是对DataGrid GridView 单页javascript 表头排序的讲解,与大家分享。

JS代码如下:

 <script>
 var curObj;
 var shell = 1;
 function sortTable(L) {
  var start=new Date()
  var i;
  var DataGrid1 = document.getElementByIdx_x_x("DataGrid1");
 var theRows=new Array();
 for (i = 1; i < DataGrid1.rows.length-1; i++) {
     var str = "";
     var tds = DataGrid1.rows[i].getElementsByTagName_r("td");
     var cloum = tds[L].innerText;
     if (L == 7 || L == 8 || L == 9) {
         cloum = tds[L].innerHTML;
     }
     var html = DataGrid1.rows[i].outerHTML;
     DataGrid1.rows[i].outerHTML);
     theRows[i - 1] = new Array(cloum,html);
 }
 if (shell==1){
 shell=2;
 //根据不同类型的列选择不同的排序方式,据实际情况定
  switch(parseInt(L)){
  case 5:
   theRows.sort(sortRows);
   break;
  case 4,3:
   theRows.sort(sortRows1);
   break;
  default:
   theRows.sort(sortRows2);
   }
 }
 else{
 shell=1;
  switch(parseInt(L)){
  case 5:
   theRows.sort(sortRows0);
   break;
  case 4,3:
   theRows.sort(sortRows11);
   break;
  default:
   theRows.sort(sortRows22);
  }
 }
 var str=''
 for(i=0;i<theRows.length;i++) {
  str+=theRows[i][1];
  }
  DataGrid1.outerHTML = '<table border="0" cellPadding="-1" cellSpacing="0" BorderColor="White" width="100%" bordercolor="#ffffff" name="DataGrid1" id="DataGrid1">'  + DataGrid1.rows[0].outerHTML + str + '</table>'
 curObj=null;
 
 return ;
 }
 //降序-------------------
 //数值类型的列进行排序
 function sortRows(x,y) {
   if(x[0]>y[0]) return -1;
   else if(x[0]<y[0]) return 1;
   else return 0;
 }
 //金额类型的列进行排序
 function sortRows1(x, y) {
     var aa = x[0].replace("¥", "").replace(",", "");
     var bb = y[0].replace("¥", "").replace(",", "");
   if(parseInt(aa)>parseInt(bb)) return -1;
   else if(parseInt(aa)<parseInt(bb)) return 1;
   else return 0;
 }
 //处理字符串列的排序
 function sortRows2(x,y) {
     return y[0].localeCompare(x[0]);
 }
 //end 降序---------------------
 //升序------------------ -
 //数值类型的列进行排序
 function sortRows0(x,y) {
   if(x[0]<y[0]) return -1;
   else if(x[0]>y[0]) return 1;
   else return 0;
 }
 //金额类型的列进行排序
 function sortRows11(x, y) {
     var aa = x[0].replace("¥", "").replace(",", "");
     var bb = y[0].replace("¥", "").replace(",", "");
   if(parseInt(aa)<parseInt(bb)) return -1;
   else if(parseInt(aa)>parseInt(bb)) return 1;
   else return 0;
 }
 //处理字符串类型的列排序
 function sortRows22(x,y) {
     return x[0].localeCompare(y[0]);
 }
 //end 升序---------------------
   </script>

后台调用方法:

 private void DataGrid1_ItemDataBound(object sender, DataGridItemEventArgs e)
 {
             if (e.Item.ItemType == ListItemType.Header)
             {
                 e.Item.Cells[2].Attributes["onClick"] = "javascript:sortTable(1)";
                 e.Item.Cells[3].Attributes["onClick"] = "javascript:sortTable(2)";
                 e.Item.Cells[4].Attributes["onClick"] = "javascript:sortTable(3)";
                 e.Item.Cells[5].Attributes["onClick"] = "javascript:sortTable(4)";
                 e.Item.Cells[6].Attributes["onClick"] = "javascript:sortTable(5)";
                 e.Item.Cells[8].Attributes["onClick"] = "javascript:sortTable(7)";
                 e.Item.Cells[9].Attributes["onClick"] = "javascript:sortTable(8)";
                 e.Item.Cells[10].Attributes["onClick"] = "javascript:sortTable(9)";
             }
 }


相关评论