使用ASP.NET CustomValidator避免重复的错误消息

Avoid duplicated error messages with ASP.NET CustomValidator

本文关键字:错误 消息 ASP NET CustomValidator 使用      更新时间:2023-09-26

我有一个以这种方式定义的ASP.NET页面:

<asp:TextBox 
    ID="_txtExitDate"
    ClientIDMode="Static"
    runat="server"
    Text='<%#Bind("exit_date","{0:dd/MM/yyyy}")%>'
    placeholder="gg/mm/aaaa" />
<asp:CompareValidator
    runat = "server" 
    Type = "Date" 
    Operator = "DataTypeCheck"
    Display = "Dynamic"
    ControlToValidate = "_txtExitDate" 
    ErrorMessage = "Exit date invalid." 
    SetFocusOnError = "true" />
<asp:CustomValidator 
    Display="Dynamic"
    runat="server" 
    EnableClientScript="true"
    ClientValidationFunction="Validate_Exit"
    ControlToValidate="_txtExitDate" 
    ErrorMessage="Exit date should be minor of today date." />
<asp:TextBox 
    ID="_txtExitTime"
    ClientIDMode="Static"
    CssClass="input_small"
    runat="server"
    Text='<%#Bind("exit_time")%>'
    placeholder="hh:mm" />
<asp:RegularExpressionValidator
    Display = "Dynamic"
    ControlToValidate="_txtExitTime"
    runat="server"
    ErrorMessage="Exit time invalid"
    ValidationExpression="^([01][0-9]|2[0-3]|[1-9]):([0-5][0-9]|[0-9])$"
    SetFocusOnError = "true" />
<asp:CustomValidator 
    Display="Dynamic"
    runat="server" 
    EnableClientScript="true"
    ClientValidationFunction="Validate_Exit"
    ControlToValidate="_txtExitTime" 
    ErrorMessage="Exit date should be minor of today date." />

评估CustomValidators的Javascript代码是:

function Validate_Exit(sender, args) {
    var _txtExitDate = $("input[id$='_txtExitDate ']");
    var _txtExitTime = $("input[id$='_txtExitTime ']");
    if (isBlank(_txtExitDate.val()) || isBlank(_txtExitTime.val())) {
        args.IsValid = true;
        return;
    }
    var _sExit = _txtExitDate .val().substring(0, 10) + " " + _txtExitTime.val().substring(0, 5);
    var _exit = moment(_sExit, "DD/MM/YYYY HH:mm:ss");
    if (_exit.isAfter(moment())) {
        args.IsValid = false;
        return;
    }
    args.IsValid = true;
}

表单的作用域是允许用户只输入有效的日期/时间值。特别是,CustomValidator旨在允许输入几个组合值,这些值应该是当前日期时间的次要值。

它和我预期的一样工作,除了一个副作用,它没有妥协,但它在图形上很烦人。

正如您所看到的,CustomValidator基本上是相同的,它应用于两个文本框。如果用户未能编写正确的日期/时间组合,它会显示消息(这是同一条消息,因为它引用了合成的日期/时刻值)。在某些情况下,错误消息显示"两次",这在一定程度上(图形上)很可怕,但也有点让用户困惑。有没有一种方法可以避免重复此检查,并为两个文本框提供一个控件,这样用户就不会被双重错误消息弄糊涂?

谨致问候,Mike

您可以使用一个CustomValidator来验证这两个字段。设置该验证器的ID,但不设置ControlToValidate属性(这里我还设置了Text属性,以便即使在未触发回发时也显示指示符):

<asp:CustomValidator 
    ID="cvDateTime"
    Display="Dynamic"
    runat="server" 
    Text="Invalid date!"
    EnableClientScript="true"
    ClientValidationFunction="Validate_Exit"
    ErrorMessage="Exit date should be minor of today date." />

您可以在两个TextBox上设置onchange事件处理程序,以便在每个字段修改后立即执行验证:

<asp:TextBox ID="_txtExitDate" onchange="ValidateOnChange();" ... />
<asp:TextBox ID="_txtExitTime" onchange="ValidateOnChange();" ... />

验证功能可能如下所示:

function ValidateOnChange() {
    var validator = document.getElementById('<%= cvDateTime.ClientID %>');
    validator.isvalid = DoValidateDateTime();
    ValidatorUpdateDisplay(validator)
}
function Validate_Exit(source, args) {
    args.IsValid = DoValidateDateTime();
}
function DoValidateDateTime() {
    var _txtExitDate = $("input[id$='_txtExitDate ']");
    var _txtExitTime = $("input[id$='_txtExitTime ']");
    if (isBlank(_txtExitDate.val()) || isBlank(_txtExitTime.val())) {
        return true;
    }
    var _sExit = _txtExitDate .val().substring(0, 10) + " " + _txtExitTime.val().substring(0, 5);
    var _exit = moment(_sExit, "DD/MM/YYYY HH:mm:ss");
    return _exit.isSameOrBefore(moment());
}