0
私はしばらくこの戦いをしていました。私はMVCに慣れていないし、Webデザインのmcguffinの後、部分的なビュー（ページ全体を更新しない）ですべてのモデル処理（検証を含む）を行っています。 私の現在のメソッド（以下）は、ajaxポストバックがあるまで（ 'ajaxを使って部分的に戻る'）取得されます。 問題は、Createボタンを押してPartial Viewを再投入する前にクライアントの検証が機能することです。私は、 '年齢'のテキストボックスをクリアし、作成を押すことでこれをテストします。フィールドが必要であるというメッセージが表示されます。次に、フィールドに有効な値intを入力して、「作成」をもう一度押して「ポスト」に戻します。さて、Ageボックスをもう一度クリアすると、エラーメッセージが表示されず、無効な値が表示されて投稿できます。 「作成」（id = yourSubmitButtonID）ボタンを押した後に、なぜそれがうまくいかないのか教えてもらえますか？mvc ajaxフォームの検証が 'post'の後に動作しなくなる
また、誰かがこれを行うより良い方法を知っている場合は、私に知らせてください。
PartialController.cs
using StuffTesterMVC.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace StuffTesterMVC.Controllers
{
public class PartialController : Controller
{
// GET: Partial
public ActionResult Partials()
{
return View();
}
public PartialViewResult GetModel01()
{
PartialViewModel01 model = new PartialViewModel01();
model.Birthday = DateTime.Parse("9/10/1964");
return PartialView("PartialViewModel01", model);
}
}
}
Partials.cshtml
@{
Layout = null;
}
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Partials</title>
</head>
<body>
<div id="divPartial01">
@Html.Partial("PartialViewModel01", new StuffTesterMVC.Models.PartialViewModel01())
</div>
@*<div id="divPartial02">
@Html.Partial("PartialViewModel02", new StuffTesterMVC.Models.PartialViewModel02())
</div>*@
<!-- SCRIPTS -->
<script>
function saveSampleModel01() {
alert('posting');
$.ajax({
url: "@Url.Action("GetModel01", "Partial")",
type: "post", // make this "get" to get data
data: $("#divPartial01").serialize(),
success: function (result) {
$("#divPartial01").html(result);
alert('success');
},
error: function (result) {
err: alert("Failed");
}
});
}
</script>
</body>
</html>
PartialViewModel01.cshtml
@model StuffTesterMVC.Models.PartialViewModel01
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>PartialViewModel01</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.Age, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Age, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Age, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Birthday, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Birthday, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Birthday, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="button" id="yourSubmitButtonID" value="Create" class="btn btn-default" />
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="button" value="Save" onclick="saveSampleModel01();" class="btn btn-default" />
</div>
</div>
</div>
<script>
$(function() {
$("#yourSubmitButtonID").click(function (e) {
e.preventDefault();
var _this = $(this);
var _form = _this.closest("form");
alert('validating');
var validator = $("form").validate(); // obtain validator
var anyError = false;
_form.find("input").each(function() {
if (!validator.element(this)) { // validate every input element inside this step
anyError = true;
}
});
if (anyError) {
alert('found errors');
return false; // exit if any error found
}
alert('no errors - do "post"');
saveSampleModel01();
//$.post(_form.attr("action"), _form.serialize(), function (data) {
//check the result and do whatever you want
})
});
</script>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
"動作しなくなった" 何_exactly_：
は、私はそれが重複した質問だったと思いますか？代わりに何が起こるのですか？どこかのエラー（ブラウザのコンソールにあるかもしれません）？あるいは何か別の行動ですか？また、Partialは親ビュー（ 'saveSampleModel01（）'の呼び出し）に依存しています。この種のものは、部分的な点を打ち消す（すなわち、繰り返し使用することができ、複数のビューで使用することができる）。 – ADyson
ページが最初にロードされた後、Ageボックスをクリアすると、フィールドが必要であることが確認されます。 Ageフィールドに記入してポストバックを押すと（Createボタンを押す）、クライアント側の検証が中止され、何かを投稿することができます。アラート（「エラーなし - 投稿」）は何に関係なく表示されます。ボタンについては、私はこれらの部分的なビューがどのように動作するはずであるかを理解しようとしています。 – Belmiris
動的コンテンツを追加した後にバリデータを再解析する必要があります。[この回答]（http://stackoverflow.com/questions/31768946/required-field-validations-not-working-in-jquery-popup-mvc- 4/31769058＃31769058）。スクリプトは部分的なものではありません。メインビューに移動します。 –