我试图在我的 ASP.net MVC 3 应用程序中验证一个弹出窗口。我在网上搜索了一个解决方案,但还没有让它们中的任何一个起作用。
我有以下非常简单的模型:
public class Player
{
public int playerId { get; set; }
[Required]
[Range(0, 99)]
public int number { get; set; }
[DisplayName("First Name")]
[Required]
[StringLength(15)]
public string firstName { get; set; }
[DisplayName("Last Name")]
[Required]
[StringLength(15)]
public string lastName { get; set; }
[Required]
public float battingAverage { get; set; }
}
然后我有以下视图,其中包含玩家列表。在这里,我使用 Jquery 弹出窗口来创建或编辑播放器。然后播放器被附加到此视图中的列表中。
@model IEnumerable<PlayingWithJSON.Models.Player>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Index</h2>
<div id="PlayerListBlock"></div>
<span class="AddLink ButtonLink">Add New Player</span>
<div id="PlayerDialog" title="" class="Hidden"></div>
<script type="text/javascript">
$(function () {
$("#PlayerDialog").dialog(
{
autoOpen: false, width: 400, height: 500, modal: true,
buttons:
{
"Save": function () {
if ($("#PlayerForm").valid()) {
$.post("/Player/Save",
$("#PlayerForm").serialize(),
function (data) {
$("#PlayerDialog").dialog("close");
$("#PlayerListBlock").html(data);
}
);
}
},
Cancel: function () { $(this).dialog("close"); }
}
});
$(".EditLink").live("click", function () {
var id = $(this).attr("playerid");
$("#PlayerDialog").html("")
.dialog("option", "title", "Edit Player")
.load("/Player/Edit/" + id, function () { $("#PlayerDialog").dialog("open"); });
});
$(".AddLink").click(function () {
$("#PlayerDialog").html("")
.dialog("option", "title", "Add Player")
.load("/Player/Create", function () { $("#PlayerDialog").dialog("open"); });
});
LoadList();
});
function LoadList() {
$("#PlayerListBlock").load("/Player/List");
}
</script>
下面是与允许我创建和编辑播放器的弹出窗口相对应的部分视图。
@model PlayingWithJSON.Models.Player
@using(Html.BeginForm("Save", "Player", FormMethod.Post, new { id = "PlayerForm" }))
{
@Html.ValidationSummary(true)
@Html.Hidden("playerId")
<label class="Number">
<span>Number</span><br />
@Html.TextBoxFor(x => x.number)<br />
@Html.ValidationMessageFor(x => x.number)
</label>
<label class="FirstName">
<span>First Name</span><br />
@Html.TextBoxFor(x => x.firstName)
@Html.ValidationMessageFor( x => x.firstName )
</label>
<label class="LastName">
<span>Last Name</span>
@Html.TextBoxFor(x => x.lastName)
@Html.ValidationMessageFor( x => x.lastName )
</label>
<label class="BattingAverage">
<span>Batting Average</span>
@Html.TextBoxFor(x => x.battingAverage)
@Html.ValidationMessageFor( x => x.battingAverage )
</label>
}
<script type="text/javascript">
$(function () {
$.validator.unobtrusive.parse("PlayerForm");
});
</script>
在此表单的底部,我添加了对 validator.unobtrusive.parse 的调用,但尚未使其正常工作。
这是控制器中的保存方法:
[HttpPost]
public ActionResult Save(Player player)
{
if (ModelState.IsValid)
{
//Save Stuff
baseBall.Players.Add(player);
baseBall.SaveChanges();
return PartialView("List", baseBall.Players.ToList());
}
else
return PartialView("PlayerForm", player);
}
当我点击弹出窗口上的“保存”按钮时,不会发生任何客户端验证。到目前为止我编写的 jquery 工作正常,但是如何包含验证?我读过验证属于部分,但我也读过验证属于“主视图”。我希望有人能做的是向我展示如何正确验证弹出窗口中的内容。