怎样使用js来控制checkboxlist的选择数量

[binny0532]

要控制checkboxlist只能选择三个选项
我的代码如下，但是不好用，请大家指点，多谢

c#

this.cblRAreaRArea1.Attributes.Add("onchange", "if (check())");

js:

<script language="javascript">
function check()
{
if(cblRAreaRArea1.Items.Count>4)
{
alert("已超过4");
return false;
}
else
return true;
}

</script>



check函数根本不起作用，都触发不了，看了网页的源码，checkboxlist的onchange="check()"

[yipiaoqingshui]

//全选或反选函数
function CheckItem()
{
//执行
oEl = event.srcElement;
for(i = 0;i < document.all.tags("input").length; i++)
{
if(document.all.tags("input")(i).id.indexOf("chkItem") != -1)
{
if(oEl.checked && !document.all.tags("input")(i).disabled)
{
document.all.tags("input")(i).checked = true;
document.all.tags("input")(i).parentElement.parentElement.style.backgroundColor='#AFD9FF';
}
else
{
document.all.tags("input")(i).checked = false;
document.all.tags("input")(i).parentElement.parentElement.style.backgroundColor='';
}
}
}


你调用这个

[Eddie005]

CheckBoxList控件，最终到客户端生成的HTML是<table>，它没有onchange事件

[binny0532]

to:yipiaoqingshui(一瓢清水)

现在选择以后触发不了check，跟用哪个函数没关系吧？
请说说你在c#那怎么写的？

[binny0532]

to：Eddie005(♂) №.零零伍 (♂)
对阿，我看源码是这样，那这种判断该怎么做？通过js

[ladOnTheBrinkOfRage]

this.cblRAreaRArea1.Attributes.Add("onchange", "return check();");

[Eddie005]

解决：

<script language="javascript">
function check(cblistID)
{
var i = 0;
var cbID = cblistID + ":" + i;
var count =0;
while(document.getElementsByName(cbID).length>0)
{
if(document.getElementsByName(cbID)[0].checked){count++;}

i++;
cbID = cblistID + ":" + i;
}
if(count>3)
{
alert("最多只能选中3项");
event.returnValue = null;
}
}

</script>


c#

this.cblRAreaRArea1.Attributes.Add("onclick","check('"+this.cblRAreaRArea1.ClientID+"');");

[cpp2017]

this.cblRAreaRArea1.Attributes.Add("onmousedown", "javascript:return GoCheck(this);");



<SCRIPT language="javascript">
<!--
function GoCheck(tb)
{

var iCount = 0 ;
for(var i=0;i<tb.rows.length;i++)
{
if(tb.rows[i].cells[0].firstChild.checked)
{
iCount ++;
}
}
if(iCount >= 4)
{
alert("超过4");
return false;
}
}
//-->
</SCRIPT>

[cpp2017]

如果这个控件是autopostback 的话就一定要用 onmousedown,否则可用onclick

[binny0532]

to :Eddie005(♂) №.零零伍 (♂) cpp2017(幕白兄)

函数都是可以触发
但是，效果却没有打到只能选四个，选的超过四个还是不出现提示

[binny0532]

to:cpp2017(幕白兄)
你的方法可行，但是只适合于一行显示一个checkbox的情况
我现在是一行显示8个checkbox



<tr>
<td>
<input id="cblRAreaRArea1_0" type="checkbox" name="cblRAreaRArea1$0" /><label for="cblRAreaRArea1_0">百合花园</label>
</td>
<td>........</td>
<td>........</td>
<td>........</td>
.......
</tr>

[cpp2017]

改一下:

this.cblRAreaRArea1.Attributes.Add("onmousedown", "javascript:return GoCheck("+this.cblRAreaRArea1.Items.Count+");");



<SCRIPT language="javascript">
<!--
function GoCheck(ItemCount)
{

var iCount = 0;
for(var i=0;i<ItemCount;i++)
{
var chk = document.getElementById("cblRAreaRArea1_"+i);
if(chk!=null )
{
if(chk.checked)
iCount ++;
}
}
if(iCount >= 3)
{
alert("超过4");
return false;
}
}

//-->
</SCRIPT>

[Eddie005]

我上面给出的代码在asp.net1.1下测试通过，如果是asp.net2.0，则需要改写两行：

var cbID = cblistID + ":" + i;
====〉 var cbID = cblistID + "$" + i;

[binny0532]

呵呵
我也刚刚改出来一个

function GoCheck(tbID)
{
var iCount = 0 ;
var objtb = document.getElementById(ID);
var objs = objtb.getElementsByTagName("INPUT");
for(var i=0;i<objs.length;i++)
{
if(objs[i].checked)
{
iCount ++;
}
}
if(iCount >= 4)
{
alert("超过4");
return false;
}
}

[binny0532]

OK了
结帖，多谢
零零伍，幕白兄

[spoky]

各位大虾可能忘了测试一个情况，如果已经选择，然后取消的时候，就会发现该次的取值是不正确的，取消反而同样+1，所以导致会出错