ITPub博客

首页 > Linux操作系统 > Linux操作系统 > C#基础回顾:GridView全选演示

C#基础回顾:GridView全选演示

原创 Linux操作系统 作者:iDotNetSpace 时间:2009-06-03 17:00:09 0 删除 编辑
    要实现的效果:

      方法一:

      首先,你需要添加一列,用于放置复选框.如果你比较熟练,可以直接通过手动写代码来实现.如果,你还比较生疏,那么就进入设计页面,选择你的GridView控件.点击右上角的三角尖:


      选择编辑列:

      添加一个模板列TemplateField.然后,切换到源代码进行后续的编辑.在你的GridView控件中刚刚生成的  标签对之间,添加一个标签对和标签对.这两个是什么意思呢?按照字面理解,应该是头模板和项目模板.联想一下我们的GridView控件,是不是有一个Header用来显示列名之类的信息,而Header之下都是我们从数据源获取的数据行呢?(当然,还有其它情况,这里不做讨论).如果你想明白了,那应该已经猜到这两个标签对是做什么用的了.我们要利用在列头处显示一个checkbox,用这个checkbox来触发全选和全不选的事件.而在中添加的checkbox则会显示在每一条数据行中.下面来看源代码:
<!--

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

--><asp:GridView ID="GridView1" runat="server">
    
<Columns>
        
<asp:TemplateField>
            
<HeaderTemplate>
                
<asp:CheckBox runat="server" ID="cbHead" OnCheckedChanged="SelectAll" AutoPostBack="true">
                
asp:CheckBox>
            
HeaderTemplate>
            
<ItemTemplate>
                
<asp:CheckBox runat="server" ID="cbItem">asp:CheckBox>
            
ItemTemplate>
        
asp:TemplateField>
    
Columns>
asp:GridView>
      上面的代码相信大家肯定看明白了,那如何来实现全选和全不选呢?这就需要编辑SelectAll方法,因为当我们点选了列头的checkbox就会触发OnCheckedChanged事件,而我们让该事件调用SelectAll方法,利用该方法来实现效果.要添加该事件,首先要在源代码中添加OnCheckedChanged="SelectAll" AutoPostBack="true" 语句,就如上面所给的代码一样.AutoPostBack属性必须设置为true(默认为false),因为我们需要在点选该checkbox后,就让其它数据行的checkbox也选中,也就是说必须告诉服务器"我已经选中了",只有当服务器接收到该消息,才会执行SelectAll方法.而AutoPostBack属性就是用于设置回发的,如果设置为true,表是点选该按钮后,就会将消息传给服务器端,否则就不会将消息传给服务器.
      啰嗦了一大堆后,继续回来.SelectAll方法如下:

<!--

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

-->protected void SelectAll(object sender, EventArgs e)
{
    
bool isChecked = ((CheckBox)(GridView1.HeaderRow.Cells[0].FindControl("cbHead"))).Checked;
    
foreach (GridViewRow gvRow in GridView1.Rows)
    {
        ((CheckBox)(gvRow.Cells[
0].FindControl("cbItem"))).Checked = isChecked;
    }
}

      这样,便实现了预定的效果. [备忘:GridView数据呈现形式有点像Excel,也是由行列组成,每一行又由许多单元格组成,在每一个单元格内又可以放置任意多的东西(包括控件),因此如果我们想要得到GridView某行某列的某个控件,就要用GridView.Rows[index].Cells[index].Controls[index]之类的方式]

      方法二:

      但是,很明显,采用postBack方式并不是最好的,每次点选都会产生一次回发,服务器都需要进行处理,这对服务器性能影响是很大的.(一个用户可能还感觉不出来,如果有上千个用户呢?).因此,最好的办法,就是让客户端自己去处理选中的事件.这就需要js来帮忙.


<!--

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

--><script language="javascript" type="text/javascript">
function selectAll(ctlName,bool)
{
   
var ctl = document.getElementById(ctlName);//根据控件的在客户端所呈现的ID获取控件
   var checkbox = ctl.getElementsByTagName('input');//获取该控件内标签为input的控件
   /*所有Button、TextBox、CheckBox、RadioButton类型的服务器端控件在解释成Html控件后,都为./>,通过type区分它们的类型。*/
   
for(var i=0;i<checkbox.length;i++)
   {
       
if(checkbox[i].type=='checkbox')
       {
            checkbox[i].checked 
= bool;
        }
    }
}
</script>

      把上述js代码添加到Head标签中.然后对GridView源代码进行一些修改,去掉OnCheckedChanged="SelectAll" AutoPostBack="true",添加onclick="javascript.:selectAll('GridView3',this.checked);"客户端事件.那么现在,当你再点选列头的checkbox时候就不会回发给服务器端处理了.

      方法三:

      有些朋友发现问题了,在上述的Js中,单纯地通过checkbox[i].type=='checkbox'来做判断,那不是意味着只要GridView控件中有checkbox,就对它进行了赋值吗,如果在其它列中也有复选框,那不是也受到连累了?
      因此上述方法只适合于只有一列复选框的情况,但是如果出现多列复选框,怎么办呢?
      我想到的方法就是通过名字来设置每一个复选框,也就是只有名字是符合的,我才对它进行操作.你可能会希望使用getElementsByName("checkbox名称")来获取控件,但是会发现,这样根本查找不到控件.因为asp.net中,为了防止绑定列在解释成HTML后出现ID、Name相同的控件,对每一个ID和NAME都进行了修改.大家可以参考这里.因此,我们只能利用控件的ClientID来获取修改后的ID.于是我通过在cs代码中注册js脚本来获取到该ID.如果,对于我所说的还不理解,请仔细阅读代码.


<!--

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

-->private void RegisterScript(GridView gv)
{
    
if (!ClientScript.IsStartupScriptRegistered("selectJSFor" + gv.ID))
    {
        string script 
= "\n"
                     
+ "function selectAllFor" + gv.ID + "(bool)\n"
                     
+ "{\n";
        
for (int i = 0; i < GridView3.Rows.Count; i++)
        {
            script 
+= "document.getElementById('" + gv.Rows[i].Cells[0].FindControl("cbItem").ClientID + "').checked=bool;\n";
        }
        script 
+= "}\n"
               
+ "\n";
        ClientScript.RegisterStartupScript(
this.GetType(), "selectJSFor" + gv.ID, script);
    }
}

 

      这样,就基本可以满足要求了.

      源文件下载.(采用VS 2005开发)

来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/12639172/viewspace-605012/,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2008-01-04

  • 博文量
    2376
  • 访问量
    5337278