为不同的用户输入显示不同的正则表达式消息

Show different regex message for different user inputs

本文关键字：正则表达式 消息 显示 用户 输入      更新时间：2023-09-26

我有一个MVC视图的输入字段有一个验证的正则表达式，这是像这样的^XY[a- za - z0 -9]{20}$

和我的Html字段看起来像

 @Html.TextBoxFor(t => t.Someclass.Name, new
                {
                    data_val = "true",
                    data_val_required = "Test Required Message",
                    data_val_regex = "Test Invalid Regex Message",
                    data_val_regex_pattern = "^XY[a-zA-Z0-9]{20}$",
                })

我有两个场景

  1. 用户输入XY12345678901235无效，显示"Test Required Message"

  2. 当用户输入123455时，这也是无效的，但是我们应该显示不同的消息错误消息2

如何实现场景2?

谢谢

使用不引人注目的客户端验证(使用jquery.validate.js和jquery.validate.unobtrusive.js)将无法做到这一点，因为它只允许每个规则一条消息。相反，您可以通过编写自己的脚本来模拟该行为，以类似的方式处理此问题。

它有点不清楚为什么你手动添加这些data-val-*属性时，它们被自动添加是你应用[Required]和[RegularExpression]属性到你的属性。首先将[Required]属性包含到您的属性中，以便以默认方式处理

[Required(ErrorMessage = "...")]
public string Name { get; set; }

和视图

@Html.TextBoxFor(m => m.Someclass.Name)
@Html.ValidationMessageFor(m => m.Someclass.Name) // for the [Required] error message
<span id="regexerror" class="field-validation-error"></span> // for the custom message

并包含以下脚本来处理文本框.change()事件以测试值(并在适用的情况下显示适当的消息)和表单提交事件以在无效时取消提交。

var isValid = true;
var regex = /^XY[a-zA-Z0-9]{20}$/;
var prefix = 'XY';
var errorMessage = $('#regexerror');
$('#Someclass_Name').change(function() {
  var name = $(this).val();
  if (!name) { // no value so let client side validation handle it
    return;
  }
  // test if we match the regex
  isValid = regex.test(name);
  if (isValid) {
    errorMessage.text(''); // clear error
  } else {
    if (name.indexOf(prefix) == 0) {
      errorMessage.text('error message 1'); // starts with XY
    } else {
      errorMessage.text('error message 2')
    }
  }
});
$('form').submit(function() {
  return isValid; // will cancel the default submit if false
});

旁注:您当然需要在服务器端重复此验证。客户端验证是一个不错的好处，但可以被覆盖(永远不要相信用户输入)。

相关文章：