38

我有一个 CheckBoxList 控件,我想要求用户至少检查一个框,不管他们检查每一个,还是 3 个,甚至只检查一个。

本着 asp.net 验证控件的精神,我可以使用什么来强制执行此操作?我也在使用 Ajax 验证扩展器,所以如果它看起来像其他控件,而不是代码隐藏中的一些俗气的服务器验证方法,那就太好了。

<asp:CheckBoxList RepeatDirection="Horizontal" RepeatLayout="Table" RepeatColumns="3" ID="ckBoxListReasons" runat="server">
    <asp:ListItem Text="Preliminary Construction" Value="prelim_construction" />
    <asp:ListItem Text="Final Construction" Value="final_construction" />
    <asp:ListItem Text="Construction Alteration" Value="construction_alteration" />
    <asp:ListItem Text="Remodel" Value="remodel" />
    <asp:ListItem Text="Color" Value="color" />
    <asp:ListItem Text="Brick" Value="brick" />
    <asp:ListItem Text="Exterior Lighting" Value="exterior_lighting" />
    <asp:ListItem Text="Deck/Patio/Flatwork" Value="deck_patio_flatwork" />
    <asp:ListItem Text="Fence/Screening" Value="fence_screening" />
    <asp:ListItem Text="Landscape - Front" Value="landscape_front" />
    <asp:ListItem Text="Landscape - Side/Rear" Value="landscape_side_rear" />
    <asp:ListItem Text="Other" Value="other" />
</asp:CheckBoxList>
4

6 回答 6

65

在服务器端做这个验证很容易,但我假设你想在客户端做这个?

JQuery可以很容易地做到这一点,只要您拥有所有复选框控件共同用作选择器的东西,例如类(.NET 控件上的 CssClass)。您可以创建一个简单的JQuery函数并将其连接到 ASP.NET 自定义验证器。请记住,如果您确实使用自定义验证器路线以确保您在服务器端检查它,以防 javascript 无法正常工作,那么您不会像其他 .NET 验证器那样获得免费的服务器端检查。

有关自定义验证器的更多信息,请查看以下链接:www.asp.netMSDN

您不需要使用JQuery,它只是使 javascript 函数迭代并查看所有复选框控件更加容易,但如果您愿意,您可以使用 vanilla javascript。

这是我在以下位置找到的示例:链接到原始

<asp:CheckBoxList ID="chkModuleList"runat="server" >
</asp:CheckBoxList>

<asp:CustomValidator runat="server" ID="cvmodulelist"
  ClientValidationFunction="ValidateModuleList"
  ErrorMessage="Please Select Atleast one Module" ></asp:CustomValidator>

// javascript to add to your aspx page
function ValidateModuleList(source, args)
{
  var chkListModules= document.getElementById ('<%= chkModuleList.ClientID %>');
  var chkListinputs = chkListModules.getElementsByTagName("input");
  for (var i=0;i<chkListinputs .length;i++)
  {
    if (chkListinputs [i].checked)
    {
      args.IsValid = true;
      return;
    }
  }
  args.IsValid = false;
}

旁注:JQuery只是一个包含您需要添加到页面的小 js 文件。一旦包含它,您就可以使用所有您喜欢的JQuery 。无需安装,我认为下一版本的 Visual Studio 将完全支持它。

于 2009-07-18T01:33:19.467 回答
14

这是一个更简洁的jQuery实现,它允许一个ClientValidationFunction用于页面上任意数量的CheckBoxList控件:

function ValidateCheckBoxList(sender, args) {
    args.IsValid = false;

    $("#" + sender.id).parent().find("table[id$="+sender.ControlId+"]").find(":checkbox").each(function () {
        if ($(this).attr("checked")) {
        args.IsValid = true;
        return;
        }
    });
}

这是标记:

<asp:CheckBoxList runat="server"
          Id="cblOptions" 
          DataTextField="Text" 
          DataValueField="Id" />

<xx:CustomValidator Display="Dynamic" 
              runat="server" 
              ID="cblOptionsValidator"
              ControlId="cblOptions"
              ClientValidationFunction="ValidateCheckBoxList" 
              ErrorMessage="One selection required." />

最后,允许客户端函数通过 ID 检索目标控件的自定义验证器:

public class CustomValidator : System.Web.UI.WebControls.CustomValidator
{
    public string ControlId { get; set; }

    protected override void OnLoad(EventArgs e)
    {
        if (Enabled)
            Page.ClientScript.RegisterExpandoAttribute(ClientID, "ControlId", ControlId);

        base.OnLoad(e);
    }
}
于 2010-10-25T14:59:29.237 回答
2

你可以用CustomValidator一点 javascript 来实现它。

<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Select at least one"
    ClientValidationFunction="checkCheckBoxList"></asp:CustomValidator>

<script type="text/javascript">
    function checkCheckBoxList(oSrc, args) {
        var isValid = false;
        $("#<%= CheckBoxList1.ClientID %> input[type='checkbox']:checked").each(function (i, obj) {
            isValid = true;
        });
        args.IsValid = isValid;
    }
</script>

而对于一个RadioButtonList

<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Select at least one" ClientValidationFunction="checkRadioButtonList"></asp:CustomValidator>

<script type="text/javascript">
    function checkRadioButtonList(oSrc, args) {
        if ($("input[name='<%= RadioButtonList1.UniqueID %>']:checked").val() == null) {
            args.IsValid = false;
        } else {
            args.IsValid = true;
        }
    }
</script>
于 2017-03-31T12:55:02.010 回答
1

这是另一个可以通过GitHub 上的Dado.Validators考虑的解决方案。

<asp:CheckBoxList ID="cblCheckBoxList" runat="server">
    <asp:ListItem Text="Check Box (empty)" Value="" />
    <asp:ListItem Text="Check Box 1" Value="1" />
    <asp:ListItem Text="Check Box 2" Value="2" />
    <asp:ListItem Text="Check Box 3" Value="3" />
</asp:CheckBoxList>

<Dado:RequiredFieldValidator runat="server" ControlToValidate="cblCheckBoxList" ValidationGroup="vlgSubmit" />

示例代码隐藏.aspx.cs

btnSubmit.Click += (a, b) =>
{
    Page.Validate("vlgSubmit");
    if (Page.IsValid) {
        // Validation Successful
    }
};

https://www.nuget.org/packages/Dado.Validators/

参考:检查是否在客户端的一组复选框中选中了一个复选框

于 2013-08-16T15:20:55.367 回答
0

我们也可以通过 C# 来实现

 bool Item_selected = false;
        foreach (ListItem item in checkbox.Items)
        {
            if (item.Selected == true)
            {
                Item_selected = true;
            }
        }
        if (!Item_selected )
        {
          //your message to user
          //  message = "Please select atleast one checkbox";
          
        }
于 2021-02-09T06:34:16.443 回答
-1

循环遍历 ckBoxListReasons 中的每个项目。每个项目都是“ListItem”类型。

ListItem 将有一个名为“Selected”的属性,它是一个布尔值。选择该项目时为真。就像是:

Dim bolSelectionMade As Boolean = False
For Each item As ListItem in ckBoxListReasons.Items
 If item.Selected = True Then
  bolSelectionMade = True
 End If
Next

如果用户至少进行了一项选择,则bolSelectionMade将设置为 true。然后,您可以使用它来设置您喜欢的任何特定验证器控件的有效状态。

于 2009-07-18T01:17:05.127 回答