看到CSDN上许多的朋友问到这样的问题,都没几个人帮助解决掉,今天心情好就总结下,帮大家解决这个问题,
问题如下这个连接地址
http://topic.csdn.net/u/20080407/11/05a1957d-1e69-4310-a1b9-1dcbf28e3fd6.html?seed=1281358213
可以前台排序,左右移动GridView选中列,,,,,上下移动GridView中选中行 的东西
样图:
前台代码:
<%
...
@ Page Language="C#" AutoEventWireup="true" CodeFile="WebForm1.aspx.cs" Inherits="WebForm1"
%>
< HTML >
< HEAD runat ="Server" >
< title > movegrid </ title >
< meta name ="GENERATOR" Content ="Microsoft Visual Studio .NET 7.1" >
< meta name ="CODE_LANGUAGE" Content ="C#" >
< meta name ="vs_defaultClientScript" content ="JavaScript" >
< meta name ="vs_targetSchema" content ="http://schemas.microsoft.com/intellisense/ie5" >
< script src ="movegrid.js" ></ script >
</ HEAD >
< body >
< form id ="Form1" method ="post" runat ="server" >
< br />
< table width ="100%" >
< tr >
< td style ="width: 100px" >
< asp:datagrid id ="PowerTable" runat ="server" BorderColor ="#CC9966" BorderStyle ="None" BorderWidth ="1px"
BackColor ="White" CellPadding ="4" >
< SelectedItemStyle Font-Bold ="True" ForeColor ="#663399" BackColor ="#FFCC66" >
</ SelectedItemStyle >
< ItemStyle ForeColor ="#330099" BackColor ="White" >
</ ItemStyle >
< HeaderStyle Font-Bold ="True" ForeColor ="#FFFFCC" BackColor ="#990000" >
</ HeaderStyle >
< FooterStyle ForeColor ="#330099" BackColor ="#FFFFCC" >
</ FooterStyle >
< PagerStyle HorizontalAlign ="Center" ForeColor ="#330099" BackColor ="#FFFFCC" Mode ="NumericPages" >
</ PagerStyle >
</ asp:datagrid ></ td >
</ tr >
< tr >
< td style ="width: 100%" >
< div style ="display:none" > < input onclick ="add_row(Main_Tab)" type ="button" value ="ins_row" >< input onclick ="add_col(Main_Tab)" type ="button" value ="ins_col" >
< input onclick ="del_row(Main_Tab)" type ="button" value ="Del_row" > < input onclick ="del_col(Main_Tab)" type ="button" value ="Del_col" >
< input onclick ="res_tab(Main_Tab)" type ="button" value ="Restore" > < input onclick ="exp_tab(Main_Tab)" type ="button" value ="Export" ></ div >
< hr />
( Move: < input id ="move" onclick ="Move_up(Main_Tab)" type ="button" value ="Up" >
< input id ="move" onclick ="Move_down(Main_Tab)" type ="button" value ="Down" >
< input id ="move" onclick ="Move_left(Main_Tab)" type ="button" value ="Left" > < input id ="move" onclick ="Move_right(Main_Tab)" type ="button" value ="Right" >
) </ td >
</ tr >
</ table >
< script > ...
//alert(document.getElementById("DataGrid1").rows.length);
var tbObj = document.getElementById("PowerTable");
var rows_length = tbObj.rows.length-1;
var page_size = 10;
var page_count = Math.ceil(rows_length / page_size);
//alert(Math.ceil(page_count));
var pager_html = "";
for(i = 1; i <= page_count; i++)...{
pager_html += "[ <a href='javascript:;' οnclick='chpager("+i+")'>"+i+"</a> ] ";
}
document.getElementById("pager").innerHTML = pager_html;
chpager(1);
//alert(rows_length);
//alert(page_size);
var last_page_count = rows_length - Math.floor(rows_length/page_size)*page_size;
//alert(last_page_count);
function chpager(nowpage)...{
for(i = 1; i <= tbObj.rows.length-1; i ++)...{
tbObj.rows[i].style.display = "none";
}
var show_page_end = nowpage == page_count ? (nowpage - 1)*page_size + last_page_count : nowpage* page_size;
for(k = (nowpage-1) * page_size + 1; k <= show_page_end; k ++)...{
tbObj.rows[k].style.display = "block";
tbObj.rows[k].style.borderBottom = "1px";
}
}
</ script >
</ form >
</ body >
</ HTML >
< HTML >
< HEAD runat ="Server" >
< title > movegrid </ title >
< meta name ="GENERATOR" Content ="Microsoft Visual Studio .NET 7.1" >
< meta name ="CODE_LANGUAGE" Content ="C#" >
< meta name ="vs_defaultClientScript" content ="JavaScript" >
< meta name ="vs_targetSchema" content ="http://schemas.microsoft.com/intellisense/ie5" >
< script src ="movegrid.js" ></ script >
</ HEAD >
< body >
< form id ="Form1" method ="post" runat ="server" >
< br />
< table width ="100%" >
< tr >
< td style ="width: 100px" >
< asp:datagrid id ="PowerTable" runat ="server" BorderColor ="#CC9966" BorderStyle ="None" BorderWidth ="1px"
BackColor ="White" CellPadding ="4" >
< SelectedItemStyle Font-Bold ="True" ForeColor ="#663399" BackColor ="#FFCC66" >
</ SelectedItemStyle >
< ItemStyle ForeColor ="#330099" BackColor ="White" >
</ ItemStyle >
< HeaderStyle Font-Bold ="True" ForeColor ="#FFFFCC" BackColor ="#990000" >
</ HeaderStyle >
< FooterStyle ForeColor ="#330099" BackColor ="#FFFFCC" >
</ FooterStyle >
< PagerStyle HorizontalAlign ="Center" ForeColor ="#330099" BackColor ="#FFFFCC" Mode ="NumericPages" >
</ PagerStyle >
</ asp:datagrid ></ td >
</ tr >
< tr >
< td style ="width: 100%" >
< div style ="display:none" > < input onclick ="add_row(Main_Tab)" type ="button" value ="ins_row" >< input onclick ="add_col(Main_Tab)" type ="button" value ="ins_col" >
< input onclick ="del_row(Main_Tab)" type ="button" value ="Del_row" > < input onclick ="del_col(Main_Tab)" type ="button" value ="Del_col" >
< input onclick ="res_tab(Main_Tab)" type ="button" value ="Restore" > < input onclick ="exp_tab(Main_Tab)" type ="button" value ="Export" ></ div >
< hr />
( Move: < input id ="move" onclick ="Move_up(Main_Tab)" type ="button" value ="Up" >
< input id ="move" onclick ="Move_down(Main_Tab)" type ="button" value ="Down" >
< input id ="move" onclick ="Move_left(Main_Tab)" type ="button" value ="Left" > < input id ="move" onclick ="Move_right(Main_Tab)" type ="button" value ="Right" >
) </ td >
</ tr >
</ table >
< script > ...
//alert(document.getElementById("DataGrid1").rows.length);
var tbObj = document.getElementById("PowerTable");
var rows_length = tbObj.rows.length-1;
var page_size = 10;
var page_count = Math.ceil(rows_length / page_size);
//alert(Math.ceil(page_count));
var pager_html = "";
for(i = 1; i <= page_count; i++)...{
pager_html += "[ <a href='javascript:;' οnclick='chpager("+i+")'>"+i+"</a> ] ";
}
document.getElementById("pager").innerHTML = pager_html;
chpager(1);
//alert(rows_length);
//alert(page_size);
var last_page_count = rows_length - Math.floor(rows_length/page_size)*page_size;
//alert(last_page_count);
function chpager(nowpage)...{
for(i = 1; i <= tbObj.rows.length-1; i ++)...{
tbObj.rows[i].style.display = "none";
}
var show_page_end = nowpage == page_count ? (nowpage - 1)*page_size + last_page_count : nowpage* page_size;
for(k = (nowpage-1) * page_size + 1; k <= show_page_end; k ++)...{
tbObj.rows[k].style.display = "block";
tbObj.rows[k].style.borderBottom = "1px";
}
}
</ script >
</ form >
</ body >
</ HTML >
后台代码:
using
System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
/**/ /// <summary>
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
/**/ /// <summary>