手把手教你如何扩展GridView之自带CheckBox

      我们在使用GridView的时候，很多时候需要使用CheckBox列，比如批量删除，批量审批，但是每每都需要记住繁琐的实现方法。多麻烦呀！再次给GridView做个手术，让它自己就能产生CheckBox岂不爽死了。以后您就有权利忘记怎么实现CheckBox列了。哈哈，作咱们这行的，就要学的慢慢退化，什么事情都记着，累也累死了。
      下面谈谈我这实现的思路:
      因为GridView是基于模板的，Columns也不能在后台添加，所以排除通过添加Column来实现，而采用在GridView创建行的时候动态创建表单元格，在表头行上添加一个全选CheckBox，数据行上添加选择框，点击全选，通过向页面注册的脚本来实现全选。
   下面就看看关键的代码：
    为了增加灵活性，添加了一个属性，控制是否显示CheckBox列  

    // 是否显示全选
        [
      Description( " 显示全选列 " ),
      Category( " 扩展 " ),
        DefaultValue( false )
      ]
         public   virtual   bool  ShowCheckAll
         {
            get
            {
                object obj2 = this.ViewState["ShowCheckAll"];
                if (obj2 != null)
                {
                    return (bool)obj2;
                }
                return false;

            }
            set
            {
                bool aShowCheckAll = this.ShowCheckAll;
                if (value != aShowCheckAll)
                {
                    this.ViewState["ShowCheckAll"] = value;
                    if (base.Initialized)
                    {
                        base.RequiresDataBinding = true;
                    }
                }
            }
        }

用于控制选择列是添加到表的左端还是右端的属性

  public   enum  CheckColumnAlign
     {
        Left, Right
    }

    // 是否显示全选
        [
      Description( " 全选列的位置 " ),
      Category( " 扩展 " ),
      DefaultValue(CheckColumnAlign.Left)
      ]
         public   virtual  CheckColumnAlign CheckColumnAlign
         {
            get
            {
                object obj2 = this.ViewState["CheckColumnAlign"];
                if (obj2 != null)
                {
                    return (CheckColumnAlign)obj2;
                }
                return CheckColumnAlign.Left;
            }
            set
            {
                CheckColumnAlign aCheckColumnAlign = this.CheckColumnAlign;
                if (value != aCheckColumnAlign)
                {
                    this.ViewState["CheckColumnAlign"] = value;
                    if (base.Initialized)
                    {
                        base.RequiresDataBinding = true;
                    }
                }
            }
        }

在页面加载的时候，注册全选脚本

 StringBuilder sb  =   new  StringBuilder();
            sb.Append( "  <script type=\ " text / javascript\ " > " );
            sb.Append( " function CheckAll(oCheckbox) " );
            sb.Append( " { " );
            sb.Append( " var GridView2 = document.getElementById(\ ""  + this.ClientID +  " \ " ); " );
            sb.Append( "  for(i = 1;i < GridView2.rows.length; i++) " );
            sb.Append( " { " );
            sb.Append( " var inputArray = GridView2.rows[i].getElementsByTagName(\ " INPUT\ " ); " );
            sb.Append( " for(var j=0;j<inputArray.length;j++) " );
            sb.Append( " { if(inputArray[j].type=='checkbox') " );
            sb.Append( " {if(inputArray[j].id.indexOf('ItemCheckBox',0)>-1){inputArray[j].checked =oCheckbox.checked; }}  } " );
            sb.Append( " } " );
            sb.Append( "  } " );
            sb.Append( " </script> " );
            ScriptManager.RegisterClientScriptBlock( this ,  this .GetType(),  " CheckFun " , sb.ToString(),  false );

在GridView的RowCreate事件中，添加如下代码，用于创建CheckBox列

    if  (ShowCheckAll)
                 {
                    GridViewRow row = e.Row;
                    if (row.RowType == DataControlRowType.Header)
                    {
                        TableCell cell = new TableCell();
                        cell.Wrap = Wrap;
                        cell.Width = Unit.Pixel(50);
                        cell.Text = " <input id='Checkbox2' type='checkbox' οnclick='CheckAll(this)'/><label>全选</label>";
                        if (CheckColumnAlign == CheckColumnAlign.Left)
                        {
                            row.Cells.AddAt(0, cell);
                        }
                        else
                        {
                            int index = row.Cells.Count;
                            row.Cells.AddAt(index, cell);
                        }
                    }
                    else if (row.RowType == DataControlRowType.DataRow)
                    {
                        TableCell cell = new TableCell();
                        cell.Wrap = Wrap;
                        CheckBox cb = new CheckBox();
                        cell.Width = Unit.Pixel(50);
                        cb.ID = "ItemCheckBox";
                        cell.Controls.Add(cb);
                        if (CheckColumnAlign == CheckColumnAlign.Left)
                        {
                            row.Cells.AddAt(0, cell);
                        }
                        else
                        {
                            int index = row.Cells.Count;
                            row.Cells.AddAt(index, cell);
                        }
                    }
                }

用于记录CheckBox的ID的属性

  public   string  CheckBoxID
         {
            get
            {
                return "ItemCheckBox";
            }
        }

使用的时候，只需要设置扩展GridView的ShowCheckAll=True,设置CheckColumnAlign为Left,CheckBox列在最左边，Right在最右面，注意因为没有添加Columns，所以Columns并没有因为因为添加了CheckBox列而变化，在Column的索引中，CheckBox列不在计算范围。
在扩展的GridView的OnRowDataBound事件中，就可以通过
CheckBox cb = e.Row.FindControl(gridView.CheckBoxID) as CheckBox;
if(cb!=null)
{ 
    if(cb.Checked)
   {
        //...
   }
}
来获取是否已经选中此行。
上篇文章:手把手教你如何扩展GridView之自动排序篇
 

转载于:https://www.cnblogs.com/jillzhang/archive/2007/06/07/775716.html