Question

我已经使用C＃生成了一个包含多个项目的CheckBoxList。现在我想设置CheckBoxList中允许的最大检查项数。如果用户检查超过允许的最大项目，将会有一个警报或其他项目将自动取消选中，以防止用户检查允许的最大项目数。

检查项目的最大数量将设置为代码隐藏（C＃）中的ChecokBoxList或使用javascript执行此操作，但javascript也应该在C＃中生成。

我需要一些帮助来解决这个问题。

示例代码：

CheckBoxList chkl = new CheckBoxList();
string[] items = {"item1", "item2", "item3", "item4", "item5"};
foreach (string item in items )
            {
                chkl.Items.Add(new ListItem(item));
            }
chkl.MaximumCheck = 3;

在代码隐藏中生成后，CheckBoxList将仅允许用户仅检查三个项目。如果用户检查超过三个项目，其他项目将自动取消选中或至少会显示一个警告，以防止用户检查三个以上的项目。

Answer 1

int x = 0;
foreach (var li in ListBox1.Items) {
 if (li.Selected == true)
 {
  x = x + 1;
 }

或者喜欢：

ListBox1.GetSelectedIndices().Length

在Javascript中：

<script type="text/javascript" language="javascript">
function CheckCheck()
{
    var chkBoxList=document.getElementById('<%=CheckBoxList1.ClientID %>');        var chkBoxCount=chkBoxList.getElementsByTagName("input");

     var btn=document.getElementById('<%=btnSubmit.ClientID %>');
     var i=0;
     var tot=0;
     for(i=0;i<chkBoxCount.length;i++)
     {
      if(chkBoxCount[i].checked)
      {
       tot=tot+1;
      }
     }

if(tot > 3)
{
   alert('Cannot check more than 3 check boxes');              
}    
</script>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" onclick="javascript:CheckCheck();">
<asp:ListItem>One</asp:ListItem>
<asp:ListItem>Two</asp:ListItem>
<asp:ListItem>Three</asp:ListItem>
<asp:ListItem>Four</asp:ListItem>
<asp:ListItem>Five</asp:ListItem>
</asp:CheckBoxList>
</td>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</td>
</tr>
</table>

Answer 2

我对这个问题有一个很好的解决方案：

在C＃中，我将使用以下代码生成包含5个项目的CheckBoxList：

CheckBoxList chkl = new CheckBoxList();
    string[] items = { "item1", "item2", "item3", "item4", "item5" };
    foreach (string item in items)
    {
        chkl.Items.Add(new ListItem(item));
    }
    chkl.AutoPostBack = true;
    chkl.CssClass = "3";
    chkl.SelectedIndexChanged += new EventHandler(BoxChecked);

正如您所看到的，CheckBoxList有5个项目，并且最大的检查项目是通过CheckBoxList的CssClass属性来设置的，假设CheckBoxList中不需要CssClass。因此，我将通过此属性设置最大检查项目，以使其更清晰。这里的关键是在CheckboxList上添加一个EventHandler，这样如果用户要检查超过最大项目，其他项目将被禁用。

EventHander将写成如下：

protected void BoxChecked(object sender, EventArgs e)
{
    try
    {
        int maximumCheck = -1;
        CheckBoxList CheckExpertiseList = (CheckBoxList)sender;
        try {
            maximumCheck = Convert.ToInt32(CheckExpertiseList.CssClass);
        }
        catch { }
        if (maximumCheck > -1)
        {
            if (CheckExpertiseList.Items.Cast<ListItem>().Where(i => (i.Selected == true)).Count() == maximumCheck)
            {
                CheckExpertiseList.Items.Cast<ListItem>().Where(i => (i.Selected == false)).ToList().ConvertAll(i => i.Enabled = false).ToList();
            }
            else if (CheckExpertiseList.Items.Cast<ListItem>().Where(i => (i.Selected == true)).Count() == maximumCheck - 1)
                CheckExpertiseList.Items.Cast<ListItem>().Where(i => (i.Selected == false)).ToList().ConvertAll(i => i.Enabled = true).ToList();
        }
    }
    catch { }
}

EventHandler事件将检查复选框列表是否已选中超限项目，否则将禁用其他项目，否则将重新启用其他项目。

Answer 3

首先，我要感谢Jeremy Thompson。他对我的问题给了我一个好主意。有点变化，我有我想要的东西。仅使用javascript解决我的问题。

<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<script type="text/javascript" language="javascript">
    function CheckCheck() {
        var chkBoxCount = this.getElementsByTagName("input");
        var max = parseInt(this.className);
        var i = 0;
        var tot = 0;
        for (i = 0; i < chkBoxCount.length; i++) {
            if (chkBoxCount[i].checked) {
                tot = tot + 1;
            }
        }

        if (tot > max) {
            var k = 0;
            for (i = 0; i < chkBoxCount.length; i++) {
                if (chkBoxCount[i].checked) {
                    k++;
                    if (k > max) {
                        chkBoxCount[i].checked = false;
                        alert('Cannot check more than ' + max + ' check boxes');
                    }
                }
            }               
        }
    }
</script>
<div>
<table>
<tr>
<td>
<asp:CheckBoxList ID="CheckBoxList1" runat="server" CssClass="3" onclick="javascript:CheckCheck.call(this);">
<asp:ListItem>One</asp:ListItem>
<asp:ListItem>Two</asp:ListItem>
<asp:ListItem>Three</asp:ListItem>
<asp:ListItem>Four</asp:ListItem>
<asp:ListItem>Five</asp:ListItem>
</asp:CheckBoxList>
</td>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>

javascript将自动识别将要调用它的控件，并且它还通过属性CssClass控件获得最大检查项。通过这样做，我还可以防止用户检查超过CheckBoxList中的最大项目而不进行一些回复。

Answer 4

private void cb_magia_SelectedIndexChanged(object sender, EventArgs e)
    {
        int maxNumber = 4;
        int iSelectedIndex = cb_magia.SelectedIndex;
        if (cb_magia.CheckedItems.Count > maxNumber)
        {
           cb_magia.SetItemCheckState(iSelectedIndex, CheckState.Unchecked);
           MessageBox.Show("you had checked the maximum checkbox value allowed");

        }
    }

CheckBoxList中的最大检查允许值

4 个答案: