在GridView里使用CheckBox

在GridView的第一列使用CheckBox控制每一行数据,是经常使用的,这里面我要记录的是全选、全消、选中行的底色更改,还有就是在提交数据的时候,取选中的行的编号等功能

aspx页面定义:

<asp:GridView ID="GridView1" runat="server">
        <Columns>
            <asp:TemplateField ShowHeader="False" HeaderText="选择">
                <ItemStyle Width="60px" Wrap="False" />
                <HeaderTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server"></asp:CheckBox>
                </HeaderTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CheckBox1" runat="server"></asp:CheckBox>
                    <asp:TextBox ID="TextBox1" runat="server" Text='<%# Eval("EventID") %>' Visible="false"></asp:TextBox>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
        <HeaderStyle Font-Bold="False" BackColor="#EEEEEE" />
        <AlternatingRowStyle BackColor="#EEEEEE" />
</asp:GridView>

这样在GridView的第一列,是CheckBox控件,在HeaderTemplate里的是用来控制全选全消的,在TemplateField里的,用来控制当前行是不是选中行

js脚本是这个:

<script type="text/javascript" language="javascript">
function changecolor(obj,color)
{
   e = event.srcElement
   if(e.checked==true)
   {
     e = e.parentElement
     e.style.background = "#C0C0FF"
    }
    else
    {
      e = e.parentElement
      e.style.background = color
     }
}

function CheckSelect(del)
{
    var rt=true;
    var num=0;
    var boxorder=0;
    var objCheckBox;
    for(var i=0;i<aspnetForm.length;i++)
    {
        ///alert(aspnetForm.elements[i].type);
        if(aspnetForm.elements[i].type=="checkbox")
        {
            boxorder++;
            objCheckBox=aspnetForm.elements[i];
            ///alert(objCheckBox.checked);
            if(objCheckBox.checked)
            {
                if(boxorder>1)
                {
                    //如果是第一个CheckBox,是用来全选全消的,这个不算,不用自加
                    num++;
                }
            }
        }
    }
    ///alert(num);
    if(!del)
    {
        if(num>1)
        {
            alert("此操作不允许选择多个事件");
            rt=false;
        }
    }
    if(num==0)
    {
        alert("此操作要求先选择一个事件");
        rt=false
    }
    ///alert(rt);
    return rt;
}

function SelectAll(sa)
{
    ///全选/全消
    var objCheckBox;
    for(var i=0;i<aspnetForm.length;i++)
    {
        if(aspnetForm.elements[i].type=="checkbox")
        {
            objCheckBox=aspnetForm.elements[i];
            objCheckBox.checked=sa;
        }
    }
}
</script>

第一个函数changecolor用来控制被选择的行的颜色突出,第二个函数CheckSelect用来判断现在有几个行被选中,第三个函数SelectAll用来控制全选全消

在cs页面里,为每一行的CheckBox绑定客户端事件:

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header || e.Row.RowType == DataControlRowType.DataRow)
        {
            CheckBox mycb = new CheckBox();
            mycb = (CheckBox)e.Row.FindControl("CheckBox1");
            if (mycb != null)
            {
                if (e.Row.RowType == DataControlRowType.DataRow)
                {
                    if (e.Row.RowIndex % 2 == 0)
                    {
                        mycb.Attributes.Add("onclick", "changecolor(this.name,'#FFFFFF')");
                    }
                    else
                    {
                        mycb.Attributes.Add("onclick", "changecolor(this.name,'#EEEEEE')");
                    }

                }
                else if (e.Row.RowType == DataControlRowType.Header)
                {
                    mycb.Attributes.Add("onclick", "SelectAll(this.checked)");
                }
            }
        }
    }

这里,对不同的DataControlRowType,我绑定了不同的客户端事件,因为定义在HeaderTemplate和ItemTemplate里的CheckBox是要执行不同的客户端事件的

上面的东西都很简单,分清楚客户端和服务器端就可以了,我一开始的时候在服务器端和客户端跳来跳去,自己都乱了,好烦啊

我在这里还要记录这样的情况:

在页面里,有一个自定义用户控件,有一个GridView控件,在自定义用户控件里,有Button用来控制GridView里的记录

我要记录的是,怎么在这个Button里,判断有哪些记录被选中

1、上面的aspx代码里,我加了TextBox,记录编号

2、在自定义用户控件里,用下面的事件,就返回选中行的编号了

public string GetEid()
    {
        //取选中的事件编号
        string streid = "";
        GridView mygv = new GridView();
        mygv = (GridView)Parent.FindControl("GridView1");
        if (mygv != null)
        {
            int i, row;
            i = 0;
            row = mygv.Rows.Count;
            CheckBox mycb = new CheckBox();
            for (i = 0; i < row; i++)
            {
                mycb = (CheckBox)mygv.Rows[i].FindControl("CheckBox1");
                if (mycb != null)
                {
                    if (mycb.Checked)
                    {
                        TextBox mytb = new TextBox();
                        mytb = (TextBox)mygv.Rows[i].FindControl("TextBox1");
                        if (mytb != null)
                        {
                            streid = streid + mytb.Text.Trim() + ",";
                        }
                    }
                }
            }
        }
        if (streid.Length > 0)
        {
            streid = streid.Remove(streid.Length - 1);
        }
        return streid;
    }

就是Parent和FindControl的使用,用Parent可以引用包含自定义用户控件的页面,对这个页面里的GridView的每一行扫描,就可以取到每一行的CheckBox了

对自定义控件里,如果有的Button需要先选择一个 or 多个记录才允许操作的,可以在自定义控件里给Button加上客户端事件

protected void Page_Load(object sender, EventArgs e)
    {
        Button1.Attributes["onclick"] = "return CheckSelect(false);";
        Button4.Attributes["onclick"] = "return CheckSelect(false);";
        Button2.Attributes["onclick"] = "return CheckSelect(true);";
    }

这里我给Button1和Button4加了不允许多个选择的事件,给Button2加了允许多个选择的事件

转载于:https://www.cnblogs.com/hzuIT/articles/715719.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值