结合AspNetPager6.0无刷新分页,排序(dataGrid)--代码讲解一

上次的给出了演示效果,这次就把代码一些细节说明一下.
首先说明下这个例子用到的结构和基类:
   1、具有dataGrid的页面继承了ListDataPage这个类,而ListDataPage类又继承了PageBase这个页面类。
         其中PageBase你可以写一些页面上最基本的属性,方法等。
         基本的代码如下:
         
/********************************************************************
    created:    2007/06/08
    filename:     \App_Code\PageBase.cs
    file path:    \App_Code
    file base:    PageBase
    author:        chengang
    
    information:    页面的基类


********************************************************************
*/



using  System;
using  System.Web;
using  System.Data;
using  System.Web.UI.WebControls;
using  System.Text;
using  System.Configuration;
using  System.Drawing;
using  System.Data.SqlClient;
using  EMEFRAME.UIControl;
using  System.Web.UI.HtmlControls;

namespace  EMEFRAME
{
    
/// <summary>
    
/// 页面的基类
    
/// </summary>

    public class PageBase : System.Web.UI.Page
    
{
        
私有变量

        
protected HtmlLink css;
        
public PageBase() 
        
{
            
//记录页面的开始执行时间


            _StartTime 
= DateTime.Now;
        }


        
属性


        
/// <summary>
        
/// 根据条件判断返回页面执行时间
        
/// </summary>
        
/// <returns></returns>

        public string PageLoadTime()
        
{
            TimeSpan usedTime 
= DateTime.Now - this._StartTime;
            
return ("页面执行时间:" + usedTime.TotalSeconds + "");
        }



        
重载方法

        
常用页面方法

        
/******************************************************************/
        
//系统权限操作方法
        
//要求每个页面PageLoad中进行调用并且传进相应的MenuCode 
        
//作者:陈刚 时间:2007-6-26
        /******************************************************************/

        
取得菜单权限(查看arr[0]、增加arr[1],删除arr[2]、修改arr[3],arr[4]审核 大小为5列:arr[0]==true表示其有查看的权限

        
设置页面显示\隐藏权限按钮的方法这里要求所有操作按钮和本方法中同名,否则是无法找到的
    }


}

   里面有alert这个可以基于ajax页面中实现js中alert功能,有权限控制功能,这些可以结合自己的项目写一些常用方法,还有css页面加载和常用js脚本加载等公用方法。
   另外它的子类ListDataPage(针对有DataGrid的页面)的代码如下:
/********************************************************************
    created:    2007/01/17
    filename:     \App_Code\ListDataPage.cs
    file path:    \App_Code
    file base:    ListDataPage
    author:        chengang
    
    information:    数据列表页的基类
********************************************************************
*/



using  System;
using  System.Web;
using  System.Data;
using  System.Web.UI.WebControls;
using  System.Text;
using  System.Configuration;
using  System.Drawing;
using  System.Data.SqlClient;
using  EMEFRAME.UIControl;
using  System.Web.UI.HtmlControls;

namespace  EMEFRAME
{
    
/// <summary>
    
/// 数据列表页的基类
    
/// </summary>

    public class ListDataPage : PageBase
    
{
        
public const int maxSortCount = 1;
        AspNetPager objPager;
        DataGrid objDataGrid;
        
public ListDataPage() { }
        
public void InitAspNetPager(AspNetPager po_Pager)
        
{
            
//动态设置用户自定义文本内容
            
//分页数量
            po_Pager.UrlPaging = false;
            po_Pager.TextAfterSelectBox 
= "<font color='#0066cc'>条</font>";
            po_Pager.TextBeforeSelectBox 
= "<font color='#0066cc'>每页</font>";
            po_Pager.PageSize 
= 20;
            
//显示几个页数
            po_Pager.NumericButtonCount = 10;
            
//是否一定显示分页控件
            po_Pager.AlwaysShow = true;
            
//自定义信息存放位置
            po_Pager.ShowCustomInfoSection = EMEFRAME.UIControl.ShowCustomInfoSection.Left;
            
//索引文本框显示方式
            po_Pager.ShowInputBox = EMEFRAME.UIControl.ShowInputBox.Always;
            po_Pager.ShowSelectBox 
= EMEFRAME.UIControl.ShowInputBox.Always;
            
//分页信息存放位置
            po_Pager.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Right;
            
//设置按钮的属性
            po_Pager.SubmitButtonClass = "ButtonCss";
            po_Pager.SubmitButtonOnMouseOut 
= "ButtonCss";
            po_Pager.SubmitButtonOnMouseOver 
= "ButtonCss_Over";
            po_Pager.SubmitButtonText 
= "Go";

            
//设置按钮的属性
            po_Pager.SelectBoxClass = "ButtonCss";
            po_Pager.SelectBoxOnMouseOut 
= "ButtonCss";
            po_Pager.SelectBoxOnMouseOver 
= "ButtonCss_Over";
        }

        
页面的排序表达式 页面的排序表达式

        
分面控件排序 DataGridSortData 分面控件排序 DataGridSortData
        
public void PagerBindDate()
        
{

            objPager.CustomInfoHTML 
= "<font color='#0066cc'>页码</font> <font color=\"red\"><b>" + objPager.CurrentPageIndex + "</b></font> <font color='#0066cc'>of</font>  " + objPager.PageCount;
            
if (objPager.RecordCount != 0)
            
{
                objPager.CustomInfoHTML 
+= "&nbsp;&nbsp;<font color='#0066cc'>当页记录</font> " + objPager.StartRecordIndex + "-" + objPager.EndRecordIndex;
            }

            
else
            
{
                objPager.CustomInfoHTML 
+= "&nbsp;&nbsp;<font color='#0066cc'>当页记录</font> 0-0";
            }

            objPager.CustomInfoHTML 
+= "&nbsp;&nbsp;<font color='#0066cc'>总记录</font> " + objPager.RecordCount;
            EMEFRAME.LoadCss.SetDataGridItem(objDataGrid);
        }

        
重载方法
    }


}


   其中InitAspNetPager(AspNetPager po_Pager)这个方法是初始化分页控件的属性,如PageSize页面初始记录数等,排序方面我们把它放到SortDirection这个属性中,其实也就是一个ViewState保存其状态。DataGridSortData这个方法是在触发排序事件的时候加载这个方法,改变其DataGrid的升降标志。PagerBindDate这个方法是在页面改变的时候改变分页控件的自定义文本区的显示,达到同步页面记录数的显示信息。(可以自己需要修改)
其他重载OnPreRender、OnInit方法中,我加载了subModal.css样式,和submodalsource.js脚本,是因为这里我用了 http://gabrito.com/files/subModal/这个网站上提供的代码替换弹出框。其中我修改了一个地方,
      if  (callReturnFunc == true ) // 主窗口上建立一个回调方法 
     {
        document.getElementById(
"TextBox1").value="reload";
        __doPostBack(
"TextBox1","")
    }
我在页面上加入一个TextBox1,作为是否回发标志。这个后面会更清楚。
2、页面上面基本上用到的控件有:ScriptManager,UpdatePanel,UpdateProgress,DataGrid,AspNetPager1,TextBox1(刚才提到是否回发标志),txt_delid(删除回复标志),btnAddNew(弹出新增页面)。其中UpdatePanel定义了3个触发器AsyncPostBackTrigger,第一个是AspNetPager1分页控件了,监听事件PageChanged,第2个就是当新增页面关闭(增加成功情况)时要对父页面(当前这个页面)进行回发,用到的是TextBox1,其事件TextChanged,最后一个就是删除事件用到的txt_delid的TextChanged,因为我这个删除按钮(其实是张图片而已)放在DataGrid中的模板中,动态绑定它的onclick 事件,回发txt_delid的改变值,好让服务端删除记录后刷新局部。

好了,页面代码如下:
<% @ Page Language="C#" AutoEventWireup="true" CodeFile="Ajax_DataGrid.aspx.cs" Inherits="Test_Ajax_DataGrid"  %>

<% @ Register Assembly="EMEFRAME" Namespace="EMEFRAME.UIControl" TagPrefix="cc1"  %>
<! 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  id ="Head1"  runat ="server" >
    
< title ></ title >
    
< script  type ="text/javascript" >
     
function _del(id)
     
{
        document.getElementById(
"txt_delid").innerText = id;
        __doPostBack(
"txt_delid","");
     }

    
</ script >

</ head >
< body >
    
< form  id ="form1"  runat ="server" >
        
< asp:ScriptManager  runat ="server"  ID ="sm" >
        
</ asp:ScriptManager >
        
< table  width ="100%" >
            
< tr >
                
< td  align ="right"  width ="70%" >
                    
&nbsp; < input  type ="button"  id ="btnAddNew"  value ="新 增"  runat ="server"  onclick ="initPopUp('新建');showPopWin('Test_Add.aspx', 400, 200)"   />
                
</ td >
            
</ tr >
        
</ table >
        
< div  id ="SearchDiv"  style ="display: none;" >
        
</ div >
        
            
< asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server"  UpdateMode ="Conditional" >
                
< ContentTemplate >
                    
< asp:DataGrid  ID ="DataGridList"  runat ="server"  Width ="100%"  AutoGenerateColumns ="False"
                        PageSize
="20"  BorderWidth ="1px"  BorderColor ="#79BCEF"  AllowSorting ="True"  OnSortCommand ="DataGridList_SortCommand"
                        OnItemDataBound
="DataGridList_ItemDataBound" >
                        
< ItemStyle  CssClass ="dgItem" ></ ItemStyle >
                        
< HeaderStyle  CssClass ="dgTitle" ></ HeaderStyle >
                        
< Columns >
                            
< asp:BoundColumn  DataField ="id"  HeaderText ="id"  SortExpression ="id" ></ asp:BoundColumn >
                            
< asp:BoundColumn  DataField ="vTest_Name"  SortExpression ="vTest_Name"  HeaderText ="名称" ></ asp:BoundColumn >
                            
< asp:BoundColumn  DataField ="VTest_Creater"  HeaderText ="创建人"  SortExpression ="VTest_Creater" >
                            
</ asp:BoundColumn >
                            
< asp:BoundColumn  DataField ="dTest_CreateDate"  SortExpression ="dTest_CreateDate"  HeaderText ="创建时间"
                                DataFormatString
="{0:d}" ></ asp:BoundColumn >
                            
< asp:TemplateColumn  HeaderText ="修改" >
                                
< HeaderStyle  Width ="70px" ></ HeaderStyle >
                                
< ItemTemplate >
                                    
< img  src ="../Images/EditBtn.gif"   />
                                
</ ItemTemplate >
                            
</ asp:TemplateColumn >
                            
< asp:TemplateColumn  HeaderText ="删除" >
                                
< HeaderStyle  Width ="50px" ></ HeaderStyle >
                                
< ItemTemplate >
                                    
< img  src ="../Images/DeleteBtn.gif"   />
                                
</ ItemTemplate >
                                
< EditItemTemplate >
                                    
< font  face ="宋体" ></ font >
                                
</ EditItemTemplate >
                            
</ asp:TemplateColumn >
                        
</ Columns >
                        
< PagerStyle  Visible ="False"  NextPageText ="下一页"  PrevPageText ="上一页" ></ PagerStyle >
                    
</ asp:DataGrid >
                    
< cc1:AspNetPager  ID ="AspNetPager1"  runat ="server"  OnPageChanged ="AspNetPager1_PageChanged"
                        PageSize
="10" >
                    
</ cc1:AspNetPager >
                    
< div  id ="popupMask" >
                    
</ div >
                
</ ContentTemplate >
                
< Triggers >
                    
< asp:AsyncPostBackTrigger  ControlID ="AspNetPager1"  EventName ="PageChanged"   />
                    
< asp:AsyncPostBackTrigger  ControlID ="TextBox1"  EventName ="TextChanged"   />
                    
< asp:AsyncPostBackTrigger  ControlID ="txt_delid"  EventName ="TextChanged"   />
                
</ Triggers >
            
</ asp:UpdatePanel >
        
< asp:Label  ID ="lblWhere"  runat ="server"  Visible ="False" ></ asp:Label >
        
< asp:TextBox  ID ="TextBox1"  runat ="server"  OnTextChanged ="TextBox1_TextChanged"  Style ="visibility: hidden" ></ asp:TextBox >
        
< asp:UpdateProgress  ID ="uprog"  runat ="server"  DisplayAfter ="20" >
            
< ProgressTemplate >
                
< div  style ="background-color: #E2F2FF; color: Black; font-size: 11pt; left: 266px;
                    position: absolute; top: 200px; z-index: 3; border: solid 1px #8DD3FF; width: 263px;
                    height: 80px; text-align: center;"
>
                    
< center >
                            
< br  />
                            
< img  src ="../Images/blu.gif"  alt =" "   />
                            
< br  />
                            数据更新中,请稍候
                            
< br  />
                    
</ center >
                
</ div >
            
</ ProgressTemplate >
        
</ asp:UpdateProgress >
        
< asp:TextBox  ID ="txt_delid"  runat ="server"  OnTextChanged ="txt_delid_TextChanged"
            Style
="visibility: hidden" ></ asp:TextBox >
    
</ form >
</ body >
</ html >


cs代码如下:

using  System;
using  System.Data;
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.HtmlControls;

using  _91dos.Components.BusApp;

public  partial  class  Test_Ajax_DataGrid : EMEFRAME.ListDataPage
{
    
protected void Page_Load(object sender, EventArgs e)
    
{
        
if (!Page.IsPostBack)
        
{
            
//页面权限控制
            
//MenuCode = "44";
            
//ShowHiddenControl();

            
/***********************************************************************************    
             初始化排序字段
            **********************************************************************************
*/

            
if ((string)ViewState["SortExpression"== null || (string)ViewState["SortExpression"== "")
            
{
                ViewState[
"SortExpression"= "dTest_CreateDate";        //默认排序字段
                ViewState["SortDirection"= false;
            }

            
/***********************************************************************************    
            绑定DataGrid数据 
            *********************************************************************************
*/

            DataGrid_bind();
        }

    }

    
//表格数据绑定
    private void DataGrid_bind()
    
{
        
int RecordCount;
        DataTable dTable 
= _91dos_TestApp.Get_91dos_TestPage(AspNetPager1.CurrentPageIndex, AspNetPager1.PageSize, lblWhere.Text, Convert.ToBoolean(ViewState["SortDirection"]), ViewState["SortExpression"].ToString(), out RecordCount);
        AspNetPager1.RecordCount 
= RecordCount;
        DataGridList.DataSource 
= dTable;
        DataGridList.DataBind();
        PagerBindDate();
    }

    
protected void DataGridList_SortCommand(object source, System.Web.UI.WebControls.DataGridSortCommandEventArgs e)
    
{
        
this.DataGridSortData(e);
        DataGrid_bind();
    }

    
//分页事件
    protected void AspNetPager1_PageChanged(object sender, EventArgs e)
    
{
        DataGrid_bind();
    }

    
//页面回调刷新
    protected void TextBox1_TextChanged(object sender, EventArgs e)
    
{
        DataGrid_bind();
        TextBox1.Text 
= "";
    }

    
protected void DataGridList_ItemDataBound(object sender, DataGridItemEventArgs e)
    
{
        
if (e.Item.ItemIndex != -1)
        
{
            
//if (e.Item.Cells[1].Text.ToUpper().Trim() == "ADMIN")
            
//{
            
//    e.Item.Cells[4].Attributes.Add("onclick", "alert(\"超级管理员不可被修改!\");");
            
//    e.Item.Cells[5].Attributes.Add("onclick", "alert(\"超级管理员不可被删除!\");");
            
//}
            
//else
            
//{
            e.Item.Cells[4].Attributes.Add("onclick""initPopUp('修改信息');showPopWin('Test_Edit.aspx?id=" + e.Item.Cells[0].Text + "', 400, 200)");
                e.Item.Cells[
5].Attributes.Add("onclick""if(confirm('是否要永久删除该条记录?')){_del('" + e.Item.Cells[0].Text + "');}");
            
//}
            for (int i = 0; i < 5; i++)
            
{
                e.Item.Cells[i].Attributes.Add(
"ondblclick""initPopUp('详细信息');showPopWin('Test_Detail.aspx?id=" + e.Item.Cells[0].Text + "', 400, 200)");
            }

        }

    }

    
//删除事件
    protected void txt_delid_TextChanged(object sender, EventArgs e)
    
{
        
if (txt_delid.Text != "")
        
{
            
if (_91dos_TestApp._91dos_TestDelete(txt_delid.Text))
            
{
                DataGrid_bind();
                txt_delid.Text 
= "";
            }

            
else
            
{
                alert(
"删除出错!");
            }

        }

    }

}

你可能感兴趣的:(datagrid)