MVC.net jQuery 验证答案

【问题标题】：MVC.net jQuery ValidationMVC.net jQuery 验证
【发布时间】：2010-09-08 20:30:33
【问题描述】：

在多年尝试避免使用 JavaScript 之后，Iv 开始在 MVC asp.net 中使用 Query for validation，因为似乎没有官方的验证方式，我很惊讶 jQuery 有多好。

首先有没有办法让智能感知适用于 jQuery 及其验证插件，这样我就不必学习 api？

其次，我如何为此创建一个验证摘要，它目前将错误附加到文本框的右侧。：

<script type="text/javascript">
$().ready(function() {
$("#CreateLog").validate({
        rules: {            
            UserName: {
                required: true,
                minLength: 2,

            }
        },
        messages: {

            UserName: {
                required: "Please enter a username",
                minLength: "Your username must consist of at least 2 characters",

            }
        }
    });
});
</script>

<form id="CreateLog" action="Create" method="post" />   
        <label>UserName</label><br />
        <%=Html.TextBox("UserName")%> 
         <br />  
          <div class="error"> </div>
        <input  type=submit value=Save />
       </form>

我尝试将此添加到脚本中：

 errorLabelContainer: $("#CreateLog div.error")

这个到 html:

  <div class="error"> </div>

但这没有用。

【问题讨论】：

标签： jquery asp.net-mvc validation

【解决方案1】：

尝试在选项中同时指定包装器和标签容器。我还在错误容器的样式中添加了display:none;，让 jQuery 决定何时显示它。

$().ready(function() {
  $("#CreateLog").validate({
    errorLabelContainer: $("ul", $('div.error-container')),
    wrapper: 'li',
    rules: {            
        UserName: {
            required: true,
            minLength: 2,

        }
    },
    messages: {
      UserName: {
        required: "Please enter a username",
        minLength: "Your username must consist of at least 2 characters"
      }
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="error-container">
  <ul></ul>
</div>

<form id="CreateLog" action="Create" method="post" />   
  <label>UserName</label><br />
  <%=Html.TextBox("UserName")%> 
  <br />  
  <input  type=submit value=Save />
</form>

应该可以的。

【讨论】：

这很有帮助，谢谢。有理由不写$('div.error-container ul') 而不是$("ul", $('div.error-container')) 吗？
@thedeeno 我们需要额外的，在“}”结束之前
@Dev11 没有，但从 ecma5 开始完全没问题。看到这个答案stackoverflow.com/a/7246662/1946

【解决方案2】：

您可能想在CodeBetter.com 和他的示例application canvas 上查看Karl Seguin 的ASP.NET MVC 验证方法。

Validation - Part 1 - Getting Started

Validation - Part 2 - Client-Side

Validation - Part 3 - Server-Side

【讨论】：

【解决方案3】：

JQuery IntelliSense 在 VS2008 中有一个 Visual Studio 2008 修补程序。这也可能与 SP1 捆绑在一起。

【讨论】：

【解决方案4】：

关于 jquery（和其他插件）的智能感知：为了在您自己的脚本文件中也有完整的智能感知，只需在 .js 文件的顶部为您想要智能感知的每个文件包含一次以下行：

/// <reference path="[insert path to script file here]" />

简单，但非常有用 =)

【讨论】：