c# - 如何在 MVC 视图中使用 jquery/ajax 验证空格

Question

我有一个包含表单的 MVC 视图，现在需要验证在特定文本字段中输入的数据。我只需要确保没有空格。在我看来，有人可以给我一个使用 jquery/ajax 脚本进行表单验证的示例。

Answer 1

将验证构建到视图模型的一部分中可能是一个好主意，这样您的模型中就会有如下内容：

[RegularExpression(@"^[\S]*$", ErrorMessage = "White space found")]
public string MyField {get;set;}

然后，您可以在视图中执行以下操作：

@Html.TextBoxFor(model => Model.MyField , new { })
@Html.ValidationMessageFor(model => Model.MyField)

要使客户端正常工作，您必须启用客户端验证和不显眼的 JS，您可以通过在<appSettings>main 部分中设置以下内容来实现web.config

<add key="ClientValidationEnabled" value="true"/>
<add key="UnobtrusiveJavaScriptEnabled" value="true"/>

您还需要将jquery.validate.js和jquery.validate.unobtrusive.js文件带入您的页面。当您在 MVC3 中创建新项目时，它们都应该捆绑在脚本文件夹中。

<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

最后，在服务器端操作方法上，您需要一些看起来像这样的东西：

    [HttpPost]
    public ActionResult Index(Thing myThing) {

        if (ModelState.IsValid) {
            //Do some work in here because we're all good
            return RedirectToAction("MyOtherAction");
        }

        //Oops the validation failed so drop back to the view we came from
        return View();
    }

完全依赖客户端 JS 是危险的，因为理论上可以绕过导致损坏的数据到达服务器端。

上面的正则表达式应该做你想要的验证，但我的正则表达式技能有点生疏。

Answer 2

在这里找到这段代码：

$(document).ready(function(){

  jQuery.validator.addMethod("noSpace", function(value, element) { 
  return value.indexOf(" ") < 0 && value != ""; 
}, "No space please and don't leave it empty");


$("form").validate({
   rules: {
      name: {
          noSpace: true
      }
   }
  });


})

Answer 3

我建议将空白检查作为模型验证的一部分。为此目的，一个简单且可重用的验证属性如下所示：

public class NoWhiteSpaceAttribute : ValidationAttribute
{
    public override bool IsValid(object value)
    {
        var strValue = value as string;
        if (!string.IsNullOrEmpty(strValue))
        {
            return !strValue.Contains(" ");
        }

        return true;
    }
}

使用示例：

[NoWhiteSpace(ErrorMessage = "No spaces allowed")]
public string UserName { get; set; }