当前位置: 代码迷 >> ASP.NET >> datalist 在客户端完成排序解决方案
  详细解决方案

datalist 在客户端完成排序解决方案

热度:2769   发布时间:2013-02-25 00:00:00.0
datalist 在客户端完成排序
我想在客户端给dataList排序,但总实现不了,下面是我的代码

<script language="javascript" type="text/javascript">
// <!CDATA[

function testSort_onclick() {
alert("function");
var oTable=document.getElementById("testTable"); //主要不只怎样取得
  var oTBody=oTable.tBodies[0]; 
  var colDataRows=oTBody.rows; 
  var aTRs=new Array; 
   
  for(var i=1;i <colDataRows.length;i++) 
  { 
  aTRs[i-1]=colDataRows[i]; 
  } 
   
  aTRs.reverse(); //操纵数组,可实现各种排列形式
   
  var oFragment=document.createDocumentFragment(); 
  for(var i=0;i <aTRs.length;i++) 
  { 
  oFragment.appendChild(aTRs[i]); 
  } 
   
  oTBody.appendChild(oFragment); 
  
  alert("game over");

}

// ]]>
</script>
</head>
<body>
  <form id="form1" runat="server">
  <table id="testDiv">
  <asp:DataList ID="firstDate" runat="server" Width="100%">
  <ItemTemplate>
  <table id="test1" style="width: 100%;border-bottom: #C1D0D5 1px solid;">
  <tr>
  <td style="width:25%; height: 14px;">
  <%# ((DataRowView)Container.DataItem)["periodNo"]%>
  </td>
  <td style="width:25%; height: 14px;">
  <%# ((DataRowView)Container.DataItem)["area"]%>
  </td>
  <td style="width:25%; height: 14px;">
  <%# ((DataRowView)Container.DataItem)["sumSalesT"]%>
  </td>
  <td style="width:25%; height: 14px;">
  <%# ((DataRowView)Container.DataItem)["orderByS"]%>
  </td>
  </tr>
  </table>
  </ItemTemplate><ItemStyle Font-Bold="True" />
  <HeaderTemplate>
  <table style="width: 100%">
  <tr>
  <td style="width:25%">
  列1</td>
  <td style="width:25%">
  列2</td>
  <td style="width:25%">
  列3</td>
  <td style="width:25%">
  列4</td>
  </tr>
  </table>
  </HeaderTemplate>
  <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
  </asp:DataList>
  </table>
  <input id="testSort" type="button" value="testSort" onclick="return testSort_onclick()" />
  相关解决方案