上接擴展GridView控件(4) - 聯動複選框（複選框的全選和取消全選）

上接>>

 

七、聲明幾個私有變量

/// <summary>
                 /// 用於存每組的全選複選框ID
                 /// </summary>
                 private string _checkAllIDString;
                 /// <summary>
                 /// 用於存每的項複選框ID
                 /// </summary>
                 private string _checkItemIDString;
                 /// <summary>
                 /// 每行有一個組的全部項複選框
                 /// </summary>
                 private Dictionary< int, string> _checkItemIDDictionary = new Dictionary< int, string>();

 

八、重寫OnRowDataBound以給咱們聲明的那些私有變量賦值。

/// <summary>
                 /// OnRowDataBound
                 /// </summary>
                 /// <param name="e"></param>
                 protected override void OnRowDataBound(GridViewRowEventArgs e)
                {
                         if (e.Row.RowType == DataControlRowType.DataRow)
                        {
                                 // GridViewRow的每一個TableCell
                                 for ( int i = 0; i < e.Row.Cells.Count; i++)
                                {
                                         // TableCell裏的每一個Control
                                         for ( int j = 0; j < e.Row.Cells[i].Controls.Count; j++)
                                        {
                                                 if (e.Row.Cells[i].Controls[j] is CheckBox)
                                                {
                                                        CheckBox chk = (CheckBox)e.Row.Cells[i].Controls[j];

                                                         // 判斷該CheckBox是否屬於全選CheckBox    
                                                         bool isCheckboxAll = false;
                                                         foreach (CheckboxAll ca in CheckboxAlls)
                                                        {
                                                                 if (chk.NamingContainer.ClientID + "_" + ca.CheckboxItemID == chk.ClientID)
                                                                {
                                                                        isCheckboxAll = true;
                                                                         break;
                                                                }
                                                        }

                                                         // 給該CheckBox增長客戶端代碼
                                                         if (isCheckboxAll)
                                                        {
                                                                 // 給Control增長一個客戶端onclick
                                                                chk.Attributes.Add( "onclick", "yy_ClickCheckItem()");
                                                                 // 給_checkItemIDDictionary賦值
                                                                 if (_checkItemIDDictionary.Count == 0 || !_checkItemIDDictionary.ContainsKey(i))
                                                                {
                                                                        _checkItemIDDictionary.Add(i, chk.ClientID);
                                                                }
                                                                 else
                                                                {
                                                                         string s;
                                                                        _checkItemIDDictionary.TryGetValue(i, out s);
                                                                        _checkItemIDDictionary.Remove(i);
                                                                        _checkItemIDDictionary.Add(i, s + this.ItemSeparator + chk.ClientID);
                                                                }

                                                                 break;
                                                        }
                                                }
                                        }
                                }
                        }
                         else if (e.Row.RowType == DataControlRowType.Header)
                        {
                                 // GridViewRow的每一個TableCell
                                 for ( int i = 0; i < e.Row.Cells.Count; i++)
                                {
                                         // TableCell裏的每一個Control
                                         for ( int j = 0; j < e.Row.Cells[i].Controls.Count; j++)
                                        {
                                                 if (e.Row.Cells[i].Controls[j] is CheckBox)
                                                {
                                                        CheckBox chk = (CheckBox)e.Row.Cells[i].Controls[j];

                                                         // 判斷該CheckBox是否屬於全選CheckBox    
                                                         bool isCheckboxAll = false;
                                                         foreach (CheckboxAll ca in CheckboxAlls)
                                                        {
                                                                 if (chk.NamingContainer.ClientID + "_" + ca.CheckboxAllID == chk.ClientID)
                                                                {
                                                                        isCheckboxAll = true;
                                                                         break;
                                                                }
                                                        }

                                                         // 給該CheckBox增長客戶端代碼
                                                         if (isCheckboxAll)
                                                        {
                                                                 // 給Control增長一個客戶端onclick
                                                                chk.Attributes.Add( "onclick", "yy_ClickCheckAll(this)");
                                                                 // 給_checkAllIDString賦值
                                                                 if (String.IsNullOrEmpty( this._checkAllIDString))
                                                                {
                                                                         this._checkAllIDString += chk.ClientID;
                                                                }
                                                                 else
                                                                {
                                                                         this._checkAllIDString += this.GroupSeparator + chk.ClientID;
                                                                }
                                                                 break;
                                                        }
                                                }
                                        }
                                }
                        }

                         base.OnRowDataBound(e);
                }

 

九、重寫GridView的OnPreRender方法，以實現每行復選框的全選與取消全選的功能。

/// <summary>
                 /// OnPreRender
                 /// </summary>
                 /// <param name="e"></param>
                 protected override void OnPreRender(EventArgs e)
                {
                         base.OnPreRender(e);

                         // CheckboxAlls裏有對象則註冊一些完成實現全選功能的客戶端腳本
                         if (CheckboxAlls.Count > 0)
                        {
                                 // 註冊實現 每行復選框的全選與取消全選 功能的JavaScript
                                 if (!Page.ClientScript.IsClientScriptBlockRegistered( "JsCheckAll"))
                                {
                                        Page.ClientScript.RegisterClientScriptBlock(
                                                 this.GetType(),
                                                 "JsCheckAll", JavaScriptConstant.jsCheckAll.Replace( "[$AllName$]", this.HiddenCheckboxAllID).Replace( "[$ItemName$]", this.HiddenCheckboxItemID).Replace( "[$GroupSeparator$]", this.GroupSeparator.ToString()).Replace( "[$ItemSeparator$]", this.ItemSeparator.ToString())
                                                );
                                }

                                 // 給_checkItemIDString賦值
                                _checkItemIDString = "";
                                 foreach (KeyValuePair< int, string> kvp in _checkItemIDDictionary)
                                {
                                        _checkItemIDString += this.GroupSeparator + kvp.Value;
                                }
                                 if (_checkItemIDString.StartsWith( this.GroupSeparator.ToString()))
                                {
                                        _checkItemIDString = _checkItemIDString.Remove(0, 1);
                                }

                                 // 註冊實現 每行復選框的全選與取消全選 功能的兩個隱藏字段
                                 // 有的時候回發後沒有從新綁定GridView，就會形成_checkAllIDString和_checkItemIDString爲空
                                 // 因此把這兩個值存到ViewSate中
                                 if (!String.IsNullOrEmpty(_checkAllIDString) && !String.IsNullOrEmpty(_checkItemIDString))
                                {
                                        ViewState[ this.HiddenCheckboxAllID] = _checkAllIDString;
                                        ViewState[ this.HiddenCheckboxItemID] = _checkItemIDString;
                                }
                                 if (ViewState[ this.HiddenCheckboxAllID] != null && ViewState[ this.HiddenCheckboxItemID] != null)
                                {
                                        Page.ClientScript.RegisterHiddenField( this.HiddenCheckboxAllID, ViewState[ this.HiddenCheckboxAllID].ToString());
                                        Page.ClientScript.RegisterHiddenField( this.HiddenCheckboxItemID, ViewState[ this.HiddenCheckboxItemID].ToString());
                                }
                        }
                }

 

控件使用
添加這個控件到工具箱裏，而後拖拽到webform上，在模板列的頭模板處添加一個複選框，在模板列的項模板處添加一個複選框，設置控件的CheckboxAlls屬性便可。CheckboxAllID是模板列全選複選框ID；CheckboxItemID是模板列項複選框ID。
ObjData.cs

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

/// <summary>
/// OjbData 的摘要說明
/// </summary>
public class OjbData
{
         public OjbData()
        {
                 //
                 // TODO: 在此處添加構造函數邏輯
                 //
        }

        [DataObjectMethod(DataObjectMethodType.Select, true)]
         public DataTable Select()
        {
                DataTable dt = new DataTable();
                dt.Columns.Add( "no", typeof( string));
                dt.Columns.Add( "name", typeof( string));

                 for ( int i = 0; i < 30; i++)
                {
                        DataRow dr = dt.NewRow();
                        dr[0] = "no" + i.ToString().PadLeft(2, '0');
                        dr[1] = "name" + i.ToString().PadLeft(2, '0');

                        dt.Rows.Add(dr);
                }

                 return dt;
        }
}

 

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>SmartGridView測試</title>
</head>
<body>
        <form id="form1" runat="server">
                <div>
                         
                        <yyc:SmartGridView ID="SmartGridView1" runat="server" AutoGenerateColumns="False"
                                DataSourceID="ObjectDataSource1" Width="100%">
                                <Columns>
                                        <asp:TemplateField>
                                                <headertemplate>
                                                        <asp:checkbox id="checkall" runat="server" />
                                                </headertemplate>
                                                <itemtemplate>
                                                        <asp:checkbox id="checkitem" runat="server" />
                                                </itemtemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField>
                                                <itemtemplate>
                                                        abc
                                                </itemtemplate>
                                        </asp:TemplateField>
                                        <asp:TemplateField>
                                                <headertemplate>
                                                        <asp:checkbox id="checkall2" runat="server" />
                                                </headertemplate>
                                                <itemtemplate>
                                                        <asp:checkbox id="checkitem2" runat="server" />
                                                </itemtemplate>
                                        </asp:TemplateField>
                                </Columns>
                                <CheckboxAlls>
                                        <yyc:CheckboxAll CheckboxAllID="checkall" CheckboxItemID="checkitem" />
                                        <yyc:CheckboxAll CheckboxAllID="checkall2" CheckboxItemID="checkitem2" />
                                </CheckboxAlls>
                                <SortTip SortAscImage="~/Images/asc.gif" SortDescImage="~/Images/desc.gif" />
                        </yyc:SmartGridView>
                        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="Select"
                                TypeName="OjbData"></asp:ObjectDataSource>
                </div>
        </form>
</body>
</html>

 

/*測試版的實現 結束*/

 

OK
[×××]