Как установить флажок в форме ASP.NET?

112

Я немного искал по этому поводу и нашел несколько частичных ответов, однако ничего такого, что дало бы мне такую ​​теплую нечеткость, «это правильный способ сделать это». Чтобы ответить на наиболее часто встречающуюся жалобу на этот вопрос: «флажки могут иметь два допустимых состояния - отмечен и не отмечен», это флажок «Я принимаю положения и условия ...», который необходимо установить, чтобы завершить регистрацию, следовательно, установка этого флажка необходима с точки зрения бизнес-логики.

Приложите к ответу полные фрагменты кода, готовые к вырезанию и вставке! Я знаю, что в этом есть несколько частей - CustomValidator (предположительно), код программной части, некоторый javascript и, возможно, проверка IsValid, и меня разочаровывает то, что в каждом примере, который я видел, один из этих критических штук отсутствует!

Боб Кауфман
источник

Ответы:

216

Функция javascript для проверки на стороне клиента (с использованием jQuery) ...

function CheckBoxRequired_ClientValidate(sender, e)
{
    e.IsValid = jQuery(".AcceptedAgreement input:checkbox").is(':checked');
}

код программной части для проверки на стороне сервера ...

protected void CheckBoxRequired_ServerValidate(object sender, ServerValidateEventArgs e)
{
    e.IsValid = MyCheckBox.Checked;
}

Код ASP.Net для флажка и валидатора ...

<asp:CheckBox runat="server" ID="MyCheckBox" CssClass="AcceptedAgreement" />
<asp:CustomValidator runat="server" ID="CheckBoxRequired" EnableClientScript="true"
    OnServerValidate="CheckBoxRequired_ServerValidate"
    ClientValidationFunction="CheckBoxRequired_ClientValidate">You must select this box to proceed.</asp:CustomValidator>

и, наконец, в вашем постбеке - будь то кнопка или что-то еще ...

if (Page.IsValid)
{
    // your code here...
}
Скотт Айви
источник
Я наверное что-то не так делаю. Я продолжу исследование со своей стороны, однако ControlToValidate = "<id-of-checkbox-control>" выдает исключение "Control <id-of-checkbox-control>, на который ссылается свойство ControlToValidate, не может быть проверено". Что нарушает работу JavaScript и т. Д.
Боб Кауфман
2
ааа, верно. Просто удалите это - CheckBox не реализует правильный интерфейс, чтобы связать его. Валидатор все равно будет нормально работать без этого набора свойств. Я обновлю свой пример соответственно.
Скотт Айви,
2
Параметр CustomValidator для имени функции javascript должен быть «ClientValidationFunction», а не «OnClientValidate». См .: msdn.microsoft.com/en-us/library/9eee01cx(v=VS.100).aspx
Крис,
1
Я бы предложил использовать jQuery("#<%= MyCheckBox.ClientID %>")вместо того, jQuery(".AcceptedAgreement input:checkbox")чтобы более четко указывать, на какой элемент вы пытаетесь повлиять.
Джесси Уэбб
3
Я изначально не заметил, что нет атрибута ControlToValidate. Включение этого атрибута вызывает исключение, поэтому слово предупреждения для других, которые также могут это пропустить.
MicrosoftAccessPros.com
19

С # версия ответа Эндрю:

<asp:CustomValidator ID="CustomValidator1" runat="server" 
        ErrorMessage="Please accept the terms..." 
        onservervalidate="CustomValidator1_ServerValidate"></asp:CustomValidator>
    <asp:CheckBox ID="CheckBox1" runat="server" />

Код программной части:

protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
{
    args.IsValid = CheckBox1.Checked;
}
Джон Раш
источник
спасибо за версию C #. Хорошее использование минимизации кода.
andrewWinn 04
13

Если вам нужен настоящий валидатор, который не полагается на jquery и также обрабатывает валидацию на стороне сервера (и вы должны. Валидация на стороне сервера является наиболее важной частью), то вот элемент управления

public class RequiredCheckBoxValidator : System.Web.UI.WebControls.BaseValidator
{
    private System.Web.UI.WebControls.CheckBox _ctrlToValidate = null;
    protected System.Web.UI.WebControls.CheckBox CheckBoxToValidate
    {
        get
        {
            if (_ctrlToValidate == null)
                _ctrlToValidate = FindControl(this.ControlToValidate) as System.Web.UI.WebControls.CheckBox;

            return _ctrlToValidate;
        }
    }

    protected override bool ControlPropertiesValid()
    {
        if (this.ControlToValidate.Length == 0)
            throw new System.Web.HttpException(string.Format("The ControlToValidate property of '{0}' is required.", this.ID));

        if (this.CheckBoxToValidate == null)
            throw new System.Web.HttpException(string.Format("This control can only validate CheckBox."));

        return true;
    }

    protected override bool EvaluateIsValid()
    {
        return CheckBoxToValidate.Checked;
    }

    protected override void OnPreRender(EventArgs e)
    {
        base.OnPreRender(e);

        if (this.Visible && this.Enabled)
        {
            System.Web.UI.ClientScriptManager cs = this.Page.ClientScript;
            if (this.DetermineRenderUplevel() && this.EnableClientScript)
            {
                cs.RegisterExpandoAttribute(this.ClientID, "evaluationfunction", "cb_verify", false);
            }
            if (!this.Page.ClientScript.IsClientScriptBlockRegistered(this.GetType().FullName))
            {
                cs.RegisterClientScriptBlock(this.GetType(), this.GetType().FullName, GetClientSideScript());
            } 
        }
    }

    private string GetClientSideScript()
    {
        return @"<script language=""javascript"">function cb_verify(sender) {var cntrl = document.getElementById(sender.controltovalidate);return cntrl.checked;}</script>";
    }
}
CirrusABS
источник
Это единственный ответ, который будет работать более чем с одним CheckBox в форме, вместо того, чтобы использовать одну функцию для каждого объекта. Ура!
Haliphax
Большое спасибо. Мне нужен был способ сделать это с помощью нескольких динамически отображаемых элементов управления. Потрясающие.
schmosef
Хотя выбранное решение Скотта является правильным / действительным, я считаю, что это более полное решение. Этот настраиваемый элемент управления должен был быть встроен в структуру. Спасибо CirrusABS!
Гейб
5

Ответ Скотта будет работать для классов флажков. Если вам нужны отдельные флажки, вы должны быть немного хитрее. Если вы просто делаете одну коробку, лучше делать это с идентификаторами. В этом примере это делается с помощью определенных флажков и не требуется jQuery. Это также хороший небольшой пример того, как вы можете добавить эти надоедливые идентификаторы элементов управления в свой Javascript.

.Ascx:

<script type="text/javascript">

    function checkAgreement(source, args)
    {                
        var elem = document.getElementById('<%= chkAgree.ClientID %>');
        if (elem.checked)
        {
            args.IsValid = true;
        }
        else
        {        
            args.IsValid = false;
        }
    }

    function checkAge(source, args)
    {
        var elem = document.getElementById('<%= chkAge.ClientID %>');
        if (elem.checked)
        {
            args.IsValid = true;
        }
        else
        {
            args.IsValid = false;
        }    
    }

</script>

<asp:CheckBox ID="chkAgree" runat="server" />
<asp:Label AssociatedControlID="chkAgree" runat="server">I agree to the</asp:Label>
<asp:HyperLink ID="lnkTerms" runat="server">Terms & Conditions</asp:HyperLink>
<asp:Label AssociatedControlID="chkAgree" runat="server">.</asp:Label>
<br />

<asp:CustomValidator ID="chkAgreeValidator" runat="server" Display="Dynamic"
    ClientValidationFunction="checkAgreement">
    You must agree to the terms and conditions.
    </asp:CustomValidator>

<asp:CheckBox ID="chkAge" runat="server" />
<asp:Label AssociatedControlID="chkAge" runat="server">I certify that I am at least 18 years of age.</asp:Label>        
<asp:CustomValidator ID="chkAgeValidator" runat="server" Display="Dynamic"
    ClientValidationFunction="checkAge">
    You must be 18 years or older to continue.
    </asp:CustomValidator>

И код позади:

Protected Sub chkAgreeValidator_ServerValidate(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ServerValidateEventArgs) _
Handles chkAgreeValidator.ServerValidate
    e.IsValid = chkAgree.Checked
End Sub

Protected Sub chkAgeValidator_ServerValidate(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ServerValidateEventArgs) _
Handles chkAgeValidator.ServerValidate
    e.IsValid = chkAge.Checked
End Sub
Джорелли
источник
3

Обычно я выполняю проверку на стороне клиента:

<asp:checkbox id="chkTerms" text=" I agree to the terms" ValidationGroup="vg" runat="Server"  />
<asp:CustomValidator id="vTerms"
                ClientValidationFunction="validateTerms" 
                ErrorMessage="<br/>Terms and Conditions are required." 
                ForeColor="Red"
                Display="Static"
                EnableClientScript="true"
                ValidationGroup="vg"
                runat="server"/>

<asp:Button ID="btnSubmit" OnClick="btnSubmit_Click" CausesValidation="true" Text="Submit" ValidationGroup="vg" runat="server" />

<script>
    function validateTerms(source, arguments) {
        var $c = $('#<%= chkTerms.ClientID %>');
        if($c.prop("checked")){
            arguments.IsValid = true;
        } else {
            arguments.IsValid = false;
        }
    }
</script>       
Роб
источник
Одно из лучших решений, так как не поддерживает Postback.
nu everest
Проблема в том, что сообщение валидатора не исчезает, если вы отправляете, а затем попробуйте установить флажок.
MC9000
-1

Способ без использования JavaScript. . страница aspx:

 <form id="form1" runat="server">
<div>
    <asp:CheckBox ID="CheckBox1" runat="server" />
    <asp:CustomValidator ID="CustomValidator1"
        runat="server" ErrorMessage="CustomValidator" ControlToValidate="CheckBox1"></asp:CustomValidator>
</div>
</form>

Код позади:

Protected Sub CustomValidator1_ServerValidate(ByVal source As Object, ByVal args As System.Web.UI.WebControls.ServerValidateEventArgs) Handles CustomValidator1.ServerValidate
    If Not CheckBox1.Checked Then
        args.IsValid = False
    End If
End Sub

Для любых действий, которые могут вам понадобиться (бизнес-правила):

If Page.IsValid Then
   'do logic
End If 

Извините за код VB. . . вы можете преобразовать его в C #, если хотите. Компания, в которой я сейчас работаю, требует VB :(

Эндрю Винн
источник
3
Это не сработает, так как вы не можете прикрепить валидатор к флажку! DOOOH!
0xDEAD BEEF 01