以较少代码实现DataGrid的排序，翻页，删除等功能【2】

荣-

于 2008-01-23 15:12:00 发布

阅读量666

点赞数

CC 4.0 BY-SA版权

文章标签： datagrid button class object server asp

本文链接：https://blog.youkuaiyun.com/xumingxsh/article/details/2061411

本文介绍了一种将DataGrid组件的排序、翻页等功能模块化的实现方式，通过将按钮及样式定义分离到主题文件和母版页中，使得页面代码更加简洁。同时，通过基类实现了DataGrid控件的通用功能。

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

关于上一篇，《以较少代码实现DataGrid的排序，翻页，删除等功能》具体实现的其他辅助代码在这儿，本篇的代码全是多个页面公用代码。
页面代码中，添加，删除，编辑这些按钮，以及DataGrid中的属性设置等HTML代码都去哪儿了呢？
DataGrid控件属性，提交按钮属性，删除按钮属性放到主题中去了。

下面是主题文件：Default.skin -- 页面中，通过styleSheetTheme="Default"来设置主题。

<%--列表页面中的DataGrid--%>
<asp:datagrid SkinID="dgdList" BorderWidth="1px" PageSize="20" Width="98%" BorderColor="#0083B9" HorizontalAlign="Center" BorderStyle="Ridge"
CssClass="tableGrid" AutoGenerateColumns="False" runat="server" AllowSorting="True" AllowPaging="True"
GridLines="Horizontal" SelectedItemStyle-Wrap="false" SelectedItemStyle-CssClass="gridSelectedItem"
EditItemStyle-CssClass="gridEditItem" EditItemStyle-Wrap="false"
AlternatingItemStyle-CssClass="gridAltItem" AlternatingItemStyle-Wrap="false"
ItemStyle-CssClass="gridItem" ItemStyle-Wrap="false"
HeaderStyle-CssClass="gridHeader" HeaderStyle-Wrap="false"
FooterStyle-CssClass="gridFooter" FooterStyle-Wrap="false"
PagerStyle-VerticalAlign="middle" PagerStyle-NextPageText="下一页"
PagerStyle-PrevPageText="上一页" PagerStyle-HorizontalAlign="Left" />

<%--提交按钮--%>
<asp:Button runat="server" Text="提交" SkinID="Submit" />

<%--删除按钮--%>
<asp:Button runat="server" Text="删除" SkinID="Delete" />

而添加，删除，编辑按钮的HTML放到母版中了。
下面是母版ListMaster.master的代码：

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="ListMaster.master.cs" Inherits="Master_ListMaster" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>无标题页</title>

    <script>
    //  添加
    //  作者：天志
    //  创建日期：2007-9-15
    function Add()
    {
        window.location = GetTableName() + "_Add.aspx";
    }

    //  编辑
    //  作者：天志
    //  创建日期：2007-9-15
    function Edit(frm)
    {
        var ret = checkSelect(frm);
        if (ret == false)
        {
            return false;
        }
        window.location = GetTableName() + "_Edit.aspx?" + GetQuery();
    }

    //  列表编辑
    //  作者：天志
    //  创建日期：2007-9-15
    function EditList()
    {
        window.open(GetTableName() + "_EditList.aspx");
    }

    //  删除
    //  作者：天志
    //  创建日期：2007-9-15
    function Delete(frm)
    {
        var ret = checkDelete(frm);
        if (ret == false)
        {
            return false;
        }
    }

    //  查看
    //  作者：天志
    //  创建日期：2007-9-15
    function View(frm)
    {
        var ret = checkSelect(frm);
        if (ret == false)
        {
            return false;
        }
        window.open(GetTableName() + "_View.aspx?" + GetQuery());
    }

    //  查询
    //  作者：天志
    //  创建日期：2007-9-15
    function Query()
    {
        window.location=GetTableName() + "_Query.aspx";
    }

    //  导出
    //  作者：天志
    //  创建日期：2007-9-15
    function Export()
    {
        window.open("http://www.cnblogs.com/Import/Export.aspx?tablename=" + GetTableName());
    }
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <table class="MenuTable">
            <tr>
                <td>
                </td>
                <td class="MenuTDAdd">
                    <input onclick="return Add()" type="button" value="添加">
                </td>
                <td class="MenuTDEdit">
                    <input onclick="return Edit(this.form)" type="button" value="编辑">
                </td>
                 <td class="MenuTDEdit">
                    <input onclick="return EditList()" type="button" value="列表编辑">
                </td>
                <td class="MenuTDDelete">
                    <asp:Button ID="btnDel" runat="server" SkinID="Delete" OnClick="btnDel_Click" OnClientClick="return Delete(this.form)" />
                </td>
                <td class="MenuTDView">
                    <input onclick="return View(this.form)" type="button" value="查看">
                </td>
                <td class="MenuTDQuery">
                    <input onclick="return Query()" type="button" value="查询">
                </td>
                <td class="MenuTDExport">
                    <input onclick="return Export()" type="button" value="导出">
                </td>
                <td class="MenuRightTD">
                </td>
            </tr>
        </table>
        <br>
        <div>
            <asp:ContentPlaceHolder ID="DefaultContent" runat="server">
            </asp:ContentPlaceHolder>
        </div>
    </form>
</body>
</html>

至于脚本Add()，Edit(frm)这里就不描述了。

还有，DataGrid中的排序，翻页，行设置哪儿去了？
放到了基类中了。
下面是基类的代码：

/// <copyright>天志（六子）  1999-2007</copyright>
/// <version>1.0</version>
/// <author>天志</author>
/// <email>Xumingxsh21@126.com</email>
/// <log date="2007-11-26">创建</log>

using System;
using System.Data;
using System.Data.SqlClient;
using System.Collections;
using System.Text.RegularExpressions;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Web.UI;

/// <summary>
/// 列表页面基类
/// </summary>
public class BaseListPage : System.Web.UI.Page
{
  protected BaseListPage ()
        : base()
    {
    }

    /// <summary>
    /// Description：覆盖基类。
    /// </summary>
    /// <param name="e"></param>
    /// <author>Xuming</author>
    /// <log date="2007-12-11">创建</log>
    protected override void OnInit(EventArgs e)
    {
        // 设置DataGrid的排序，分页事件
        if (InitialDataGridControl != null)
        {
            this.InitialDataGrid(InitialDataGridControl);
        }

        base.OnInit(e);
    }

    /// <summary>
    /// 设置DataGrid控件的分页，排序事件。
    /// </summary>
    /// <param name="dgdList"></param>
    protected void InitialDataGrid(DataGrid dgdList)
    {
        dgdList.PageIndexChanged += new DataGridPageChangedEventHandler(DataGrid_PageIndexChanged);
        dgdList.ItemCreated += new DataGridItemEventHandler(DataGrid_ItemCreated);
        dgdList.SortCommand += new DataGridSortCommandEventHandler(DataGrid_SortCommand);
        dgdList.ItemDataBound += new DataGridItemEventHandler(DataGrid_ItemDataBound);
    }

     /// <summary>
    /// 设置事件的DataGrid。
    /// </summary>
    protected virtual DataGrid InitialDataGridControl
    {
        get
        {
            return null;
        }
    }

     /// <summary>
    /// 分页。
    /// </summary>
    /// <param name="source">DataGrid控件</param>
    /// <param name="e">存储事件数据对象</param>
    /// <author>天志</author>
    /// <log date="2007-11-21">创建</log>
    protected virtual void DataGrid_PageIndexChanged(object source, System.Web.UI.WebControls.DataGridPageChangedEventArgs e)
    {

    }

    /// <summary>
    /// 添加表头的排序标识。
    /// </summary>
    /// <param name="source">DataGrid控件</param>
    /// <param name="e">存储事件数据对象</param>
    /// <author>天志</author>
    /// <log date="2007-11-21">创建</log>
    protected virtual void DataGrid_ItemCreated(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
    {

    }

    /// <summary>
    /// 排序。
    /// </summary>
    /// <param name="source">DataGrid控件</param>
    /// <param name="e">存储事件数据对象</param>
    /// <author>天志</author>
    /// <log date="2007-11-21">创建</log>
    protected virtual void DataGrid_SortCommand(object source, System.Web.UI.WebControls.DataGridSortCommandEventArgs e)
    {

    }

    /// <summary>
    /// 设置行格式。
    /// </summary>
    /// <param name="source">DataGrid控件</param>
    /// <param name="e">存储事件数据对象</param>
    /// <author>天志</author>
    /// <log date="2007-11-21">创建</log>
    protected void DataGrid_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
    {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            // 获取每行的数据
            DataRowView drv = (DataRowView)e.Item.DataItem;
            this.ItemDataBoundSet(sender, e, drv);
        }
    }

     /// <summary>
    /// 设置普通行的格式。
    /// </summary>
    /// <param name="sender">DataGrid控件</param>
    /// <param name="e">存储事件数据对象</param>
    /// <param name="drv">行数据</param>
    protected virtual void ItemDataBoundSet(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e, DataRowView drv)
    {
    }

     /// <summary>
    /// 取得DataGrid的数据源。
    /// </summary>
    /// <returns>数据源</returns>
    /// <author>天志</author>
    /// <log date="2007-11-13">创建</log>
    protected virtual DataView GetDataView()
    {
        throw new Exception("没有重写基类中的“GetData()”函数，所以无法设置DataGrid的数据源。");
    }

      /// <summary>
    /// 添加DataGrid的数据源。
    /// </summary>
    /// <param name="dgdList">DataGrid控件</param>
    /// <param name="refresh">是否重新读取数据源</param>
    /// <param name="sortExpression">排序字段</param>
    /// <author>天志</author>
    /// <log date="2007-11-13">创建</log>
    private void BindDataGrid(DataGrid dgdList, bool refresh, string sortExpression)
    {

}
}

基类里，有几个函数是允许被覆盖的。
GetDataView()：取得DataGrid的数据源。
InitialDataGridControl属性：当前页面中的DataGrid。
ItemDataBoundSet(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e, DataRowView drv)：根据不同的情景，设置DataGrid的行显示格式。