请教下在repeater中针对每行数据进行全选怎么做
日期：2014-05-18 浏览次数：20440 次
请问下在repeater中针对每行数据进行全选如何做?
具体就是在 <HeaderTemplate> 中放一个复选框进行全选/全不选操作, <ItemTemplate> 则有若干项复选框,受上面所控制.
我以前做过整个repeater的全选,但不知道这种一个repeater有多处分别全选是不是可以做?如果可以请给点思路或代码.如不行说一下一搬如何解决这种问题.多谢!
------解决方案--------------------
function SetCheckBoxState()
{
var dom = document.all;
var el = event.srcElement;
if(el.tagName == "INPUT " && el.type.toLowerCase()== "checkbox ")
{
for(i=0;i <dom.length;i++)
{
if(dom[i].tagName== "INPUT " && dom[i].type.toLowerCase()== "checkbox ")
{
dom[i].checked = false;
}
}
}
el.checked = !el.checked;
}
<asp:TemplateColumn HeaderText= "选择 " HeaderStyle-HorizontalAlign= "Center ">
<HeaderStyle Font-Size= "10pt " Font-Bold= "True " Wrap= "False " HorizontalAlign= "Center " VerticalAlign= "Middle "> </HeaderStyle>
<ItemStyle Wrap= "False " HorizontalAlign= "Center "> </ItemStyle>
<ItemTemplate>
<asp:CheckBox id= "chkExport " Runat= "server " BackColor= "Transparent " Width= "35px " Height= "10px "> </asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
------解决方案--------------------
可以在checkbox的id上做一些手脚，数据绑定的时候让相关的checkbox的id有关系，借用purplesunshine(紫色阳光)的代码稍改一下
<!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>
<title> Untitled Page </title>
<script language=javascript type= "text/javascript " src= "admin/js/jquery-latest.pack.js "> </script>
<script language=javascript type= "text/javascript ">
function SetCheckBoxState()
{
var dom = document.all;
var el = event.srcElement;
if(el.tagName == "INPUT " && el.type.toLowerCase()== "checkbox ")
{
for(i=0;i <dom.length;i++)
{
if(dom[i].tagName== "INPUT " && dom[i].type.toLowerCase()== "checkbox " && dom[i].id.substring(0,3) == el.id)
{
dom[i].checked = el.checked;
}
}
}
}
</script>
</head>
<body>
<input id= "cb1 " type= "checkbox " onclick=SetCheckBoxState() />
中国 <br />
<input id= "cb11 " type= "checkbox " /> 北京
<input id= "cb12 " type= "checkbox " /> 上海 <br />
<input id= "cb2 " type= "checkbox " onclick=SetCheckBoxState() /> 美国 <br />
<input id= "cb21 " type= "checkbox " /> 纽约
<input id= "cb22 " type= "checkbox " /> 华盛顿
</body>
</html>
具体就是在 <HeaderTemplate> 中放一个复选框进行全选/全不选操作, <ItemTemplate> 则有若干项复选框,受上面所控制.
我以前做过整个repeater的全选,但不知道这种一个repeater有多处分别全选是不是可以做?如果可以请给点思路或代码.如不行说一下一搬如何解决这种问题.多谢!
------解决方案--------------------
function SetCheckBoxState()
{
var dom = document.all;
var el = event.srcElement;
if(el.tagName == "INPUT " && el.type.toLowerCase()== "checkbox ")
{
for(i=0;i <dom.length;i++)
{
if(dom[i].tagName== "INPUT " && dom[i].type.toLowerCase()== "checkbox ")
{
dom[i].checked = false;
}
}
}
el.checked = !el.checked;
}
<asp:TemplateColumn HeaderText= "选择 " HeaderStyle-HorizontalAlign= "Center ">
<HeaderStyle Font-Size= "10pt " Font-Bold= "True " Wrap= "False " HorizontalAlign= "Center " VerticalAlign= "Middle "> </HeaderStyle>
<ItemStyle Wrap= "False " HorizontalAlign= "Center "> </ItemStyle>
<ItemTemplate>
<asp:CheckBox id= "chkExport " Runat= "server " BackColor= "Transparent " Width= "35px " Height= "10px "> </asp:CheckBox>
</ItemTemplate>
</asp:TemplateColumn>
------解决方案--------------------
可以在checkbox的id上做一些手脚，数据绑定的时候让相关的checkbox的id有关系，借用purplesunshine(紫色阳光)的代码稍改一下
<!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>
<title> Untitled Page </title>
<script language=javascript type= "text/javascript " src= "admin/js/jquery-latest.pack.js "> </script>
<script language=javascript type= "text/javascript ">
function SetCheckBoxState()
{
var dom = document.all;
var el = event.srcElement;
if(el.tagName == "INPUT " && el.type.toLowerCase()== "checkbox ")
{
for(i=0;i <dom.length;i++)
{
if(dom[i].tagName== "INPUT " && dom[i].type.toLowerCase()== "checkbox " && dom[i].id.substring(0,3) == el.id)
{
dom[i].checked = el.checked;
}
}
}
}
</script>
</head>
<body>
<input id= "cb1 " type= "checkbox " onclick=SetCheckBoxState() />
中国 <br />
<input id= "cb11 " type= "checkbox " /> 北京
<input id= "cb12 " type= "checkbox " /> 上海 <br />
<input id= "cb2 " type= "checkbox " onclick=SetCheckBoxState() /> 美国 <br />
<input id= "cb21 " type= "checkbox " /> 纽约
<input id= "cb22 " type= "checkbox " /> 华盛顿
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
