ASP.NET MVC に接続されている jQuery 検証の基本のいくつかを理解するのに苦労しています。
この質問の短いバージョンは次のとおりです: によって生成されたコード@Html.EditorFor()が jQuery 検証を実行できるようにするために、どの魔法が欠けていますか?
学習課題として (そして、Web サイトで実際にやりたいことを模倣しているため)、Visual Studio 2012 で新しい MVC 4 アプリを作成しました。ビュー モデルを追加しました。
using System.ComponentModel.DataAnnotations;
namespace ValidationTest.Models
{
public class MyViewModel
{
[Required]
public string MyStringValue { get; set; }
}
}
Views\Home\Index.cshtml を変更して、ビュー モデルに基づいて次のようなフォームを作成しました。
@model ValidationTest.Models.MyViewModel
@using (Html.BeginForm(new { id = "MyForm" })) {
@Html.LabelFor(m => m.MyStringValue)
@Html.EditorFor(m => m.MyStringValue)
@Html.ValidationMessageFor(m => m.MyStringValue)
<br />
<input type="submit" value="Submit" />
}
最後に、ビュー モデルをフォームに提供し、関連する POST を処理するように Home コントローラーを次のように変更しました。
using System.Web;
using System.Web.Mvc;
using ValidationTest.Models;
namespace ValidationTest.Controllers
{
public class HomeController : Controller
{
[HttpGet]
public ActionResult Index()
{
var viewModel = new MyViewModel();
return View(viewModel);
}
[HttpPost]
public ActionResult Index(MyViewModel viewModel)
{
if (!ModelState.IsValid) return View(viewModel);
return RedirectToAction("About");
}
public ActionResult About()
{
ViewBag.Message = "Your app description page.";
return View();
}
public ActionResult Contact()
{
ViewBag.Message = "Your contact page.";
return View();
}
}
}
プロジェクトを実行すると、Web ページにテキスト ボックスが表示され、ユーザーが値を入力する必要があることが魔法のように検証されます。ここまでは順調ですね...
さて、私の実際のアプリはオンライン調査です。スクリプトに基づいて質問を表示し、回答を求めます。私の実際のビューモデルには、質問のテキスト、ユーザーによって提供された値などにマップされるプロパティが含まれています。ビューモデルには、ユーザーが値を提供する必要があるかどうか (つまり、有効にするかどうか) を指定する Boolean Required プロパティも含まれています。ビューでの「必須」検証) - これは[Required]、viewmodel の MyStringValue プロパティの属性を削除し、viewmodel の Required プロパティに基づいて独自の検証マジックを提供する必要があることを意味します。
これは私が迷子になるところです。IE では、サンプル アプリ (上で概説) の @html.xxx 呼び出しがフォームの次の HTML を生成することがわかります。
<label for="MyStringValue">MyStringValue</label>
<input class="text-box single-line"
data-val="true"
data-val-required="The MyStringValue field is required."
id="MyStringValue"
name="MyStringValue"
type="text"
value="" />
<span data-valmsg-for="MyStringValue" data-valmsg-replace="true"></span>
しかし、明らかに jQuery 検証ライブラリを参照している HTML はページのどこにも見当たりませんし、検証を可能にする JavaScript コードも見当たりません。
さらに、[Required]属性を削除し、ビューをハードコーディングして上記の HTML を出力すると (魔法の @html.xxx() 呼び出しなしで)、検証はまったく行われません。
私は何が欠けていますか？