2

我在我的 MVC 项目中为电子邮件 ID 和确认电子邮件 ID 使用了 2 个文本框。

在视图中:

@Html.TextBoxFor(m => m.Email, new { maxlength = 50, title = "Enter Email" })
@Html.ValidationMessageFor(m => m.Email)
@Html.TextBoxFor(m => m.ReEmail, new { maxlength = 50, title = "Confirm Email" })
@Html.ValidationMessageFor(m => m.ReEmail)

在视图模型上:

    [DisplayName("Email")]
    [Required(ErrorMessage = "Please enter Email")]
    [RegularExpression(RegexTypes.EMAIL, ErrorMessage = RegexTypes.EMAIL_MESSAGE)]
    public string Email { get; set; }

    [DisplayName("Confirm Email")]
    [Required(ErrorMessage = "Please re enter Email")]
    [RegularExpression(RegexTypes.EMAIL, ErrorMessage = RegexTypes.CONFIRM_EMAIL_MESSAGE)]
    [DataType(DataType.EmailAddress)]
    [System.Web.Mvc.Compare("Email", ErrorMessage = "The email and confirmation email does not match.")]
    public string ReEmail { get; set; }

它工作正常并显示消息。

如果电子邮件无效,我想停止用户,然后用户不应该能够在第二个文本框中输入确认电子邮件,直到电子邮件不正确。怎么做?有人请帮助我。

4

3 回答 3

1

如果电子邮件无效,您可以添加自定义 jQuery,以在确认文本框获得焦点时重新关注电子邮件文本框。

$("#confirmTextBox").focusin(function() {
    if (!emailIsValid())
    {
        $("#emailTextboxID").focus();
    }
});

其中 emailIsValid() 是您自己的方法。

如果您想进一步阻止用户的操作,您可以在邮件文本框的 Blur 上执行此操作(这意味着在电子邮件有效之前他无法将任何其他内容集中在页面上)。

$("#emailTextboxID").blur(function() {
    if (!emailIsValid())
    {
        $(this).focus();
    }
});

最后,您还可以禁用 tab 键:

//disable the tab key
$(document).keydown(function(objEvent) {
    if (objEvent.keyCode == 9) {  //tab pressed
        objEvent.preventDefault(); // stops its action
    }
})  
于 2013-10-08T12:05:01.320 回答
0

这只是一个提示:

@Html.TextBoxFor(m => m.Email, new { maxlength = 50, title = "Enter Email", onblur="regainFocusOnError()" })

[编辑]刚刚进行了快速测试,它可以工作。这里的技巧是检查助手生成的输入验证类,如果它重新关注输入:

@Html.TextBoxFor(m => m.UserName, 
new { maxlength = 50, title = "Enter Email", onblur="var me = this; setTimeout(function() { if($(me).hasClass('input-validation-error')) { me.focus(); } }, 0);" })
于 2013-10-08T12:08:52.903 回答
0

假设您使用的是 jQuery.validate,您可以自己封装验证函数。请注意,此代码将触发您页面上所有经过 jquery 验证的电子邮件。

$(function() {
    // track original validation method
    var originalMailValidator = $.validator.methods.email;

    var keepFocus = function() {
        var that = this;
        setTimeout(function() { that.focus(); }, 0);
    };

    // encapsulate the original validation function in custom
    // function which keeps focus
    $.validator.methods.email = function(value, element) {
        $(element).unbind('blur', keepFocus);
        var result = originalMailValidator.apply(this, [value, element]);
        if (!result)
            $(element).bind('blur', keepFocus);
        return result;
    };
});
于 2013-10-08T13:19:39.287 回答