Как проверить, что пользователь выбрал хотя бы один флажок в списке флажков?

У меня есть элемент управления CheckBoxList, который я хочу потребовать от пользователя установить хотя бы один флажок, не имеет значения, проверяют ли они каждый, или 3, или даже только один.

в духе asp.net контроль проверки, что я могу использовать для обеспечения этого? Я также использую расширитель проверки Ajax, поэтому было бы неплохо, если бы он выглядел как другие элементы управления, а не какой-то дрянной метод проверки сервера в codebehind.

<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>

6 ответов


Это легко сделать на стороне сервера проверки, но я предполагаю, что вы хотите сделать это на стороне клиента?

в jQuery может сделать это очень легко, если у вас есть что-то, что все элементы управления checkbox имеют общее для использования в качестве селектора, такого как class (CssClass на вашем элементе управления .NET). Вы можете сделать простой в jQuery функция и соедините ее с ASP.NET пользовательский валидатор. Помните, если вы идете по настраиваемому маршруту валидатора, чтобы убедиться, что вы проверяете его на стороне сервера также, если javascript не работает, вы не получаете бесплатную проверку на стороне сервера, как другие валидаторы .NET.

дополнительные сведения о пользовательских валидаторах см. по следующим ссылкам:www.asp.net и MSDN

вам не нужно использовать в jQuery, это просто делает функцию javascript для итерации и просмотра всех ваших элементов управления checkbox намного проще, но вы можете просто использовать 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, я думаю.


вот это 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);
    }
}

проверьте эту статью от 4 парней из Rolla:

http://aspnet.4guysfromrolla.com/articles/092006-1.aspx

Они показывают, как создать валидатор для элементов управления CheckBox и CheckBoxList, который работает точно так же, как RequiredFieldValidator для других элементов управления .NET. Он имеет проверку на стороне сервера и проверку на стороне клиента. Хорошая часть о том, что вы можете указать ValidationGroup и он будет работать с Управления ValidationSummary.

в нижней части статьи также есть ссылка для загрузки источника и его использования в вашем проекте. Вы просто ссылаетесь на dll и регистрируете элементы управления, и вам хорошо идти.


вот еще одно решение, которое можно рассмотреть через Дадо.Валидаторы на GitHub.

<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" />

пример codebehind.аспн.cs

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

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

Ref:проверьте, установлен ли флажок в группе флажков на стороне клиента


цикл через каждый из элементов в 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, если пользователь сделал хотя бы один выбор. Затем вы можете использовать это, чтобы установить допустимое состояние любого конкретного элемента управления validator.

надеюсь, что это помогает!

Ричард.


можно использовать 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>