33

jQueryValidateプラグインをうまく再生するのに問題があります。

モデル

public class FooVM
{
    [Required]
    public string Name { get; set; }
}

レイアウト

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <script src="@Url.Content("~/scripts/jquery-1.9.0.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/scripts/jquery-migrate-1.0.0.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/scripts/jquery.validate.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/scripts/bootstrap.min.js")" type="text/javascript"></script>
        <link href="@Url.Content("~/content/bootstrap-responsive.min.css")" rel="stylesheet" type="text/css" />
        <link href="@Url.Content("~/content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
        <title>@ViewBag.Title</title>
    </head>
    <body>
    <div class="container">
        <div class="row">
            <div class="span12">
                <div class="navbar">
                    <div class="navbar-inner">
                        <a class="brand" href="#">idoneit</a>
                        <ul class="nav">
                            <li class="menu-link">@Html.ActionLink("Home", "index", "bar")</li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="span12 error-container">

            </div>
            <div class="span12 main-body">
                @RenderBody()
            </div>
        </div>
    </div>
    </body>
</html>

意見

model bootstrapvalidate.Models.FooVM
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using (Html.BeginForm("add", "bar", FormMethod.Post, new { @class = "form-horizontal" }))
{
    <fieldset>
        @Html.ValidationSummary()
        <legend>Testing Bootstrap & Validate</legend>
        <div class="control-group">
            <label for="Name" class="control-label">Name</label>
            <div class="controls">
              @Html.TextBoxFor(x => x.Name) 
            </div>
            <button type="submit" class="btn">Add!</button>
        </div>
    </fieldset>
}

送信すると、エラーメッセージが簡単に表示され、フォームがとにかく投稿されます。

私が以前に見たことのないことに気づいたことの1つは、マークアップに「novalidate」属性が含まれていることです。

<form action="/bar/add" class="form-horizontal" method="post" novalidate="novalidate">

私が読んだビットから、これは検証を妨げるHTML5属性です。そうそう、これが私が推測する原因です。

質問は-なぜベジェサスがフォームに追加されているのですか？私はそれを求めていません！

編集：@robの回答に基づいて少し掘り下げましたが、jquery validateが例外をスローしているようです。したがって、ポストバックです。

デバッグ結果

これはjquery.validate1.10です

4

5 に答える 5

32

novalidate属性はjquery.validateの32行目で追加されます。

// Add novalidate tag if HTML5.
this.attr('novalidate', 'novalidate');

HTML5を使用している場合は、次の属性を削除します。

$("#contactForm").validate();
$("#contactForm").removeAttr("novalidate");

web.configで、次のことを確認してください。

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

また、コメントアウトされていないことを確認してください。

于 2013-01-21T12:17:12.430 に答える
6

これは、私の側では本当に言葉の悪い質問だったと思います。

基本的に、問題はnovalidation属性ではありませんでした（@robastaが言ったように）。

jQuery1.9とjQuery.Validate1.10をうまく再生できませんでした。jQuery 1.83に戻すと、すぐに修正され、すべて期待どおりに機能しました。

于 2013-01-21T14:01:21.393 に答える
4

クイックスキャンと以前のコメントを読んだところdata-val=true、フォーム内のいずれかの項目に属性がある場合、novalidateプロパティがによって自動的に挿入されることに気付きましたjquery.validate。

これらの属性を使用している場合は、検証を行うつもりのないものがあるため、これは理にかなっています。したがって、novalidate属性です。ただし、w3schoolsのhtml5novalidateプロパティを読み取ることで、デフォルトを上書きできますnovalidate。新しいjquery.validateスクリプトはこれを説明する必要があります。

それはやせっぽちだと思います。誰かが同意するなら教えてください。

于 2013-05-19T04:47:42.170 に答える
1

変化する

// Add novalidate tag if HTML5.
this.attr('novalidate', 'novalidate');

に

// Add novalidate tag if HTML5.
    if (typeof (Worker) !== "undefined") { this.attr('novalidate', 'novalidate');
于 2013-06-29T10:25:08.727 に答える
-2

デフォルトのjqueryフォーム検証では、この属性をHtml.BeginForm @ novalidate=""に追加します。

于 2021-03-23T08:03:12.060 に答える