Mic*_*ael 0 asp.net-mvc unobtrusive-validation
更新2:
jQuery版本兼容性问题.
更新1:
我的脚本参考中有一个拼写错误.但是我现在遇到这个问题:
TypeError: $(...).live is not a function
$("a[data-ajax=true]").live("click", function (evt) {
Run Code Online (Sandbox Code Playgroud)
=====================================
当我通过ajax.beginform提交一个有效的表单时,在控制器中,它返回JSON,它显示在视图中而不是由回调函数处理,我无法弄清楚为什么会这样.
我从网上拿了一个演示项目,以防万一看起来很熟悉.
HTML/JS
@model Unobtrusive_Validation.Models.BlogPost
<html>
<head>
</head>
<body>
<script src="~/Scripts/jquery-1.9.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/jquery.unobtrusive.ajax.js"></script>
@using (Ajax.BeginForm("Test", "BlogPost",
new AjaxOptions{
HttpMethod = "POST",
OnSuccess = "OnSuccess",
OnBegin = "alert('OnBegin')",
OnComplete = "alert('OnComplete')",
OnFailure = "alert('OnFailure')"
} )
)
{
@Html.ValidationSummary(true)
<fieldset>
<legend>BlogPost</legend>
<div class="editor-label">
@Html.LabelFor(model => model.PostedOn)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.PostedOn)
@Html.ValidationMessageFor(model => model.PostedOn)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Title)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Title)
@Html.ValidationMessageFor(model => model.Title)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Content)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Content)
@Html.ValidationMessageFor(model => model.Content)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Category)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Category)
@Html.ValidationMessageFor(model => model.Category)
</div>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
}
</body>
<script type='text/javascript'>
function OnSuccess(result) {
console.log(result);
if (result.success == false) {
alert("failed");
}
}
</script>
</html>
Run Code Online (Sandbox Code Playgroud)
控制器:
public class BlogPostController : Controller
{
// GET: /BlogPost/Create
public ActionResult Create()
{
return View();
}
[HttpPost]
public ActionResult Test(BlogPost _model)
{
return Json(new {success = false} );
}
}
Run Code Online (Sandbox Code Playgroud)
Web.config文件
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
Run Code Online (Sandbox Code Playgroud)
<script src="~/Scripts/jquery.unobtrusive.ajax.js"></script>
Run Code Online (Sandbox Code Playgroud)
应该:
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
Run Code Online (Sandbox Code Playgroud)
如果您使用了一个javascript调试工具(如FireBug或Chrome Developer工具栏)并查看了"网络"标签,那么当浏览器尝试检索由于您的拼写错误而指定的不存在的文件时,您会立即看到404错误.
我还建议你把所有的javascript文件放在DOM的末尾,就在结束</body>标记之前.
故事的道德:使用javascript调试工具,如FireBug或Chrome开发人员工具栏.我不可能想象一个人在没有使用这样的工具的情况下进行Web开发.
更新:
还要记住,在jQuery 1.9中,.live() method has been removed这是一个重大变化.不幸的是,ASP.NET MVC的unobtrusive-ajax脚本依赖于这个功能.因此,如果您想在MVC中使用一些不显眼的javascript功能,您可能需要使用旧版本的jQuery.
| 归档时间: |
|
| 查看次数: |
4536 次 |
| 最近记录: |