在GridView的第一列使用CheckBox控制每一行数据,是经常使用的,这里面我要记录的是全选、全消、选中行的底色更改,还有就是在提交数据的时候,取选中的行的编号等功能
aspx页面定义:
这样在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绑定客户端事件:
这里,对不同的DataControlRowType,我绑定了不同的客户端事件,因为定义在HeaderTemplate和ItemTemplate里的CheckBox是要执行不同的客户端事件的
上面的东西都很简单,分清楚客户端和服务器端就可以了,我一开始的时候在服务器端和客户端跳来跳去,自己都乱了,好烦啊
我在这里还要记录这样的情况:
在页面里,有一个自定义用户控件,有一个GridView控件,在自定义用户控件里,有Button用来控制GridView里的记录
我要记录的是,怎么在这个Button里,判断有哪些记录被选中
1、上面的aspx代码里,我加了TextBox,记录编号
2、在自定义用户控件里,用下面的事件,就返回选中行的编号了
就是Parent和FindControl的使用,用Parent可以引用包含自定义用户控件的页面,对这个页面里的GridView的每一行扫描,就可以取到每一行的CheckBox了
对自定义控件里,如果有的Button需要先选择一个 or 多个记录才允许操作的,可以在自定义控件里给Button加上客户端事件
这里我给Button1和Button4加了不允许多个选择的事件,给Button2加了允许多个选择的事件