GridView 实现自定义分页、排序、查询、添加、编辑、多选删除

最新推荐文章于 2021-09-07 09:45:12 发布

转载最新推荐文章于 2021-09-07 09:45:12 发布 · 167 阅读

文章标签：

#ui #javascript #xhtml #ViewUI

本文详细介绍 ASP.NET 中 GridView 控件的使用方法，包括页面事件处理、数据绑定、分页和排序等功能，并提供了完整的示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

运行效果图：

PM_Base.aspx

@ Page Language="C#" AutoEventWireup="true" CodeFile="PM_Base.aspx.cs" Inherits="PM_Base"

EnableEventValidation="false" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

</head>

<body>

<tr>

<input id="btnView" runat="server" type="button" value="查看" style="width: 50px; height: 20px;"

class="ClassBtn" onclick="return View();" />

<asp:Button ID="btnSearch" runat="server" Text="查询" Enabled="false" Width="50px"

Height="20px" OnClick="btnSearch_Click" />

<input id="btnAdd" runat="server" type="button" value="添加" style="width: 50px; height: 20px;"

class="ClassBtn" onclick="return Add();" />

<input id="btnEdit" runat="server" type="button" value="修改" style="width: 50px; height: 20px;"

class="ClassBtn" onclick="return Edit();" />

<asp:Button ID="btnDelete" runat="server" Text="删除" Width="50px" Height="20px" OnClick="btnDelete_Click"

OnClientClick="javascript:return ( checkSelect() && confirm('警告：删除将无法恢复！\n确认删除吗？') );" />

<asp:Button ID="btnPrint" runat="server" Text="打印" Width="50px" Height="20px" OnClick="btnToExcel_Click" />

<asp:Button ID="btnOut" runat="server" Text="导出" Width="50px" Height="20px" OnClick="btnToExcel_Click" />

</td>

</tr>

</table>

<asp:GridView ID="GridView1" SkinID="gvClass2" runat="server" Width="%" DataKeyNames="ID"

AutoGenerateColumns="False" OnRowDataBound="GridView1_RowDataBound" OnDataBound="GridView1_DataBound"

AllowSorting="True" OnSorting="GridView1_Sorting" AllowPaging="True" PageSize=""

OnPageIndexChanging="GridView1_PageIndexChanging">

<tr>

<asp:Label ID="MessageLabel" ForeColor="Blue" Text="页码:" runat="server" />

<asp:DropDownList ID="PageDropDownList" AutoPostBack="true" OnSelectedIndexChanged="PageDropDownList_SelectedIndexChanged"

runat="server" />

<asp:LinkButton CommandName="Page" CommandArgument="First" ID="linkBtnFirst" runat="server">首页</asp:LinkButton>

<asp:LinkButton CommandName="Page" CommandArgument="Prev" ID="linkBtnPrev" runat="server">上一页</asp:LinkButton>

<asp:LinkButton CommandName="Page" CommandArgument="Next" ID="linkBtnNext" runat="server">下一页</asp:LinkButton>

<asp:LinkButton CommandName="Page" CommandArgument="Last" ID="linkBtnLast" runat="server">尾页</asp:LinkButton>

</td>

<asp:Label ID="CurrentPageLabel" ForeColor="Blue" runat="server" />

</td>

</tr>

</table>

</PagerTemplate>

<asp:TemplateField>

</ItemTemplate>

<input id="checkAll" title="全选" onclick="javascript:CheckAll(this);" runat="server"

type="checkbox" />

</HeaderTemplate>

</asp:TemplateField>

<asp:BoundField DataField="Name" HeaderText="名称" SortExpression="Name">

</asp:BoundField>

<asp:BoundField DataField="Description" HeaderText="描述" SortExpression="Description">

</asp:BoundField>

</Columns>

</asp:GridView>

<asp:Label ID="Message" runat="server" ForeColor="Red"></asp:Label>

</form>

</body>

</html>

function $(s)

{return document.getElementById(s);}

function isNull(_sVal)

{return (_sVal == "" || _sVal == null || _sVal == "#ff0000");}

//获取地址栏参数

function GetURL(name)

{

var URLParams = new Array();

var aParams = document.location.search.substr(1).split('&');

for (i=0; i < aParams.length; i++)

{

var aParam = aParams[i].split('=');

URLParams[aParam[0]] = aParam[1];

}

//取得传过来的name参数

return URLParams[name];

}

var tgs;

var tmp_background_val;

function tog(n,flags)

{

if (tgs)

{

tgs.style.background= tmp_background_val ;

}

n.style.background= '#99ccff' ;

tmp_background_val=flags;

tgs=n;

}

function GetRowIndex(obj)

{

$('<%=HiddenID.ClientID %>').value = obj;

}

var HiddenID;

function checkSelect()

{

HiddenID=$('<%=HiddenID.ClientID %>').value;

if(isNull(HiddenID))

{

alert("请选择一条记录!");

}

return !isNull(HiddenID);

}

function CheckAll(spanChk)//CheckBox全选

{

var oItem = spanChk.children;

var theBox=(spanChk.type=="checkbox")?spanChk:spanChk.children.item[0];

xState=theBox.checked;

elm=theBox.form.elements;

for(i=0;i<elm.length;i++)

if(elm[i].type=="checkbox" && elm[i].id!=theBox.id)

{

if(elm[i].checked!=xState)

elm[i].click();

}

//---------------------------------------------------------

//查看

function View()

{

if(checkSelect())

{

var url="PM_BaseEdit.aspx?ID=" + HiddenID + "&tableName=" + GetURL("tableName");

winOpen(url);

}

//添加

function Add()

{

var url="PM_BaseAdd.aspx?tableName=" + GetURL("tableName");

winOpen(url);

}

//编辑

function Edit()

{

if(checkSelect())

{

var url="PM_BaseEdit.aspx?ID=" + HiddenID + "&tableName=" + GetURL("tableName");

winOpen(url);

}

//弹出打开新页面-------------------------------------------

function winOpen(url)

{

var sFeatures='height=, width=, top=, left=,toolbar=0, menubar=0, scrollbars=auto, resizable=1, location=0, status=0';

window.open(url,"PM_Base",sFeatures);

}

function showDialog(url)

{

var sFeatures = "dialogHeight:400px;dialogWidth:500px;resizeable:no;help:no;status:no";

var obj=showModalDialog(url,window,sFeatures);

}

</script>

PM_Base.aspx.cs

using System;

using System.Data;

using System.Data.OleDb;

using System.Data.SqlClient;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Web.Caching;

using Framework.Components;

public partial class PM_Base : Framework.UI.PageBase

{

Page事件#region Page事件

MX.PM.BLL.Progress myBiz = new MX.PM.BLL.Progress();

string tableName;

protected void Page_Load(object sender, EventArgs e)

{

tableName = base.GetUrl("tableName");

//首先要进行权限判断

if (!string.IsNullOrEmpty(tableName))

{

if (!Page.IsPostBack)

{

if (!Framework.Globals.CurrentPrincipal.HasPermission((int)Framework.Helper.ProjectManage.BaseBrowse))

{

Framework.AppException exception = new Framework.AppException("对不起,您无权操作此页面!");

GridView1.Visible = false;

btnView.Disabled = true;

}

if (!Framework.Globals.CurrentPrincipal.HasPermission((int)Framework.Helper.ProjectManage.BaseSelect))

{

btnSearch.Enabled = false;

btnPrint.Enabled = false;

btnOut.Enabled = false;

}

if (!Framework.Globals.CurrentPrincipal.HasPermission((int)Framework.Helper.ProjectManage.BaseAdd))

{

btnAdd.Disabled = true;

}

if (!Framework.Globals.CurrentPrincipal.HasPermission((int)Framework.Helper.ProjectManage.BaseUpdate))

{

btnEdit.Disabled = true;

}

if (!Framework.Globals.CurrentPrincipal.HasPermission((int)Framework.Helper.ProjectManage.BaseDelete))

{

btnDelete.Enabled = false;

}

// 在此处放置查询代码

string strTableName = "PM_Progress";

this.btnSearch.OnClientClick = "javascript:window.showModalDialog('../Tools/AjaxGeneralSearch/AjaxSeachPage.aspx?table=" + strTableName + "','','dialogWidth:500px; dialogHeight:400px; status:; help:; center:; scroll:; resizable:;');";

}

GetData();//重新获取操作后的数据源

if (!Page.IsPostBack)

{

BindGrid();//绑定GridView,为删除服务

}

#endregion

GridView#region GridView

属性#region 属性

/**//**/

/**//// <summary>

/// 获取或设置数据源

/// </summary>

public DataTable DataSource

{

get

{

if (ViewState["dataSource"] == null)

return null;

else

return (DataTable)ViewState["dataSource"];

}

set

{

ViewState["dataSource"] = value;

}

/**//**/

/**//// <summary>

/// 获取或设置排序方向

/// </summary>

public SortDirection Sort_Direction

{

get

{

if (ViewState["sortDirection"] == null)

return SortDirection.Ascending;

else

return (SortDirection)ViewState["sortDirection"];

}

set

{

ViewState["sortDirection"] = value;

}

/**//**/

/**//// <summary>

/// 获取或设置当前分页码

/// </summary>

public int CurrentPage

{

get

{

if (ViewState["CurrentPage"] == null)

return;

else

return (int)ViewState["CurrentPage"];

}

set

{

ViewState["CurrentPage"] = value;

}

#endregion

数据绑定#region 数据绑定

/**//**/

/**//// <summary>

/// 获取数据

/// </summary>

protected void GetData()

{

this.DataSource = myBiz.GetBase(tableName).Tables[]; ;

}

/**//**/

/**//// <summary>

/// GridView 数据绑定

/// </summary>

private void BindGrid()

{

Message.Text = "";

GridView1.DataSource = this.DataSource;

GridView1.DataBind();

GridView1.PageIndex = CurrentPage;//设置当前页

}

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)

{

if (e.Row.RowType == DataControlRowType.DataRow)

{

System.Web.UI.HtmlControls.HtmlInputCheckBox check = (System.Web.UI.HtmlControls.HtmlInputCheckBox)e.Row.FindControl("check");

string id = check.Value;

if (e.Row.RowIndex % != )

e.Row.Attributes.Add("onclick", "GetRowIndex('" + id + "'),tog(this,'#EFF3FB')");

else

e.Row.Attributes.Add("onclick", "GetRowIndex('" + id + "'),tog(this,'#ffffff')");

}

#endregion

分页绑定#region 分页绑定

protected void PageDropDownList_SelectedIndexChanged(Object sender, EventArgs e)

{

GridViewRow pagerRow = GridView1.BottomPagerRow;

DropDownList pageList = (DropDownList)pagerRow.Cells[].FindControl("PageDropDownList");

GridView1.PageIndex = pageList.SelectedIndex;

this.CurrentPage = pageList.SelectedIndex;

BindGrid();

}

protected void GridView1_DataBound(Object sender, EventArgs e)

{

if (this.DataSource.Rows.Count > )

{

GridViewRow pagerRow = GridView1.BottomPagerRow;

LinkButton linkBtnFirst = (LinkButton)pagerRow.Cells[].FindControl("linkBtnFirst");

LinkButton linkBtnPrev = (LinkButton)pagerRow.Cells[].FindControl("linkBtnPrev");

LinkButton linkBtnNext = (LinkButton)pagerRow.Cells[].FindControl("linkBtnNext");

LinkButton linkBtnLast = (LinkButton)pagerRow.Cells[].FindControl("linkBtnLast");

if (GridView1.PageIndex == )

{

linkBtnFirst.Enabled = false;

linkBtnPrev.Enabled = false;

}

else if (GridView1.PageIndex == GridView1.PageCount - )

{

linkBtnLast.Enabled = false;

linkBtnNext.Enabled = false;

}

else if (GridView1.PageCount <= )

{

linkBtnFirst.Enabled = false;

linkBtnPrev.Enabled = false;

linkBtnNext.Enabled = false;

linkBtnLast.Enabled = false;

}

DropDownList pageList = (DropDownList)pagerRow.Cells[].FindControl("PageDropDownList");

Label pageLabel = (Label)pagerRow.Cells[].FindControl("CurrentPageLabel");

if (pageList != null)

{

for (int i = ; i < GridView1.PageCount; i++)

{

int pageNumber = i + ;

ListItem item = new ListItem(pageNumber.ToString() + "/" + GridView1.PageCount.ToString(), pageNumber.ToString());

if (i == GridView1.PageIndex)

{

item.Selected = true;

}

pageList.Items.Add(item);

}

if (pageLabel != null)

{

int currentPage = GridView1.PageIndex + ;

pageLabel.Text = "当前页： " + currentPage.ToString() +

" / " + GridView1.PageCount.ToString();

}

#endregion

分页#region 分页

protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)

{

GridView1.PageIndex = e.NewPageIndex;

this.CurrentPage = e.NewPageIndex;//保存当前页码

BindGrid();

}

#endregion

排序#region 排序

/**///// <summary>

/// 排序

/// </summary>

protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)

{

SortGridView(ref GridView1, this.DataSource, e);

}

/**//// <summary>

/// 实现排序

/// </summary>

private void SortGridView(ref GridView gv, object dt, GridViewSortEventArgs e)

{

string sortDirection = "";

string sortExpression = e.SortExpression;

if (this.Sort_Direction == SortDirection.Ascending)

{

this.Sort_Direction = SortDirection.Descending;

sortDirection = "DESC";

}

else

{

this.Sort_Direction = SortDirection.Ascending;

sortDirection = "ASC";

}

DataView Source = new DataView((DataTable)dt);

Source.Sort = e.SortExpression + " " + sortDirection;

gv.DataSource = Source;

gv.DataBind();

}

#endregion

按钮事件#region 按钮事件

查询#region 查询

protected void btnSearch_Click(object sender, EventArgs e)

{

GetData();

BindGrid();

}

#endregion

删除#region 删除

/**//// <summary>

/// 删除，用循环得到用户选择的CheckBox

/// </summary>

protected void btnDelete_Click(object sender, EventArgs e)

{

Message.Text = "";

string sID = "";

for (int i = ; i < GridView1.Rows.Count; i++)

{

GridViewRow row = GridView1.Rows[i];

System.Web.UI.HtmlControls.HtmlInputCheckBox check = (System.Web.UI.HtmlControls.HtmlInputCheckBox)row.FindControl("check");

if (check.Checked)

{

sID += check.Value + ",";

}

if (sID.Length > )

{

//MX.Sys.DAL.Log log = new MX.Sys.DAL.Log(this.UserInfo.UserName, "删除数据表" + tableName + ",sID=" + sID);

myBiz.DeleteBase(tableName, sID);//截取结尾的逗号

Message.Text = "删除成功!";

GetData();

BindGrid();

}

else

{

Message.Text = "删除失败,请勾选要删除项!";

}

#endregion

导出打印#region 导出打印

public override void VerifyRenderingInServerForm(Control control)

{

// 为转 excel 出问题而加上的过程(一定加！！）// Confirms that an HtmlForm control is rendered for

}

protected void btnToExcel_Click(object sender, EventArgs e)

{

System.IO.StringWriter stringWrite = new System.IO.StringWriter();

System.Web.UI.HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);

GridView1.AllowPaging = false;//取消分页

BindGrid();

GridView1.RenderControl(htmlWrite);

GridView1.AllowPaging = true;//恢复分页

BindGrid();

//---专用导出页面

PrintInfo info = new PrintInfo();

info.Title = "工程列表";

info.Orientation = true;

info.ShowTime = true;

info.Text = stringWrite.ToString();

ToPrint(info);

//---

}

/**//// <summary>

/// 打印

/// </summary>

private void ToPrint(PrintInfo info)

{

Session["ToExcel"] = info;//***用Session传递参数

string strURL = "../Tools/WebPrint";

string sFeatures = "height=, width=, top=, left=,toolbar=no, menubar=no, scrollbars=yes, resizable=no, location=no, status=";

string js = "window.open('{}','print','{}');";

js = string.Format(js, strURL, sFeatures);

Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "print", js, true);

}

#endregion

}