当我通过可以保留文本框填充/空的，在这两种情况下，众目睽睽之下被加载提交的局部视图。我怎么能叫阿贾克斯后呢？ [英] When I submit the partial view by either keeping the textbox filled/empty, in both cases full view is loading. How can I call Ajax to post it?
问题描述
我有地区MVC3如下所述。
I have Area in MVC3 as mentioned below.
型号
public class AdminModule
{
[Display(Name = "MyName")]
[Required(ErrorMessage = "MyName is missing")]
public String MyName { get; set; }
}
我有以下code管窥。
@model _1.Areas.Admin.Models.AdminModule
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "myForm" }))
{
@Html.LabelFor(i => i.MyName)
@Html.TextBoxFor(i => i.MyName)
@Html.ValidationMessageFor(i => i.MyName)
<p id="getDateTimeString">
</p>
<input type="submit" value="Click here" id="btn" />
}
查看
@model _1.Areas.Admin.Models.AdminModule
@{
ViewBag.Title = "Index";
Layout = "~/Areas/Admin/Views/Shared/_LayoutPage1.cshtml";
}
<h2>
Index</h2>
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript">
</script>
<script type="text/javascript" src="/scripts/jquery.unobtrusive-ajax.js">
</script>
<div id="myForm">
@Html.Partial("_PartialPage1", Model)
</div>
布局
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
</head>
<body>
<div>
@RenderBody()
</div>
</body>
</html>
控制器操作
[HttpPost]
public ActionResult Index(AdminModule model)
{
return PartialView(model);
}
[HttpGet]
public ActionResult Index()
{
AdminModule model = new AdminModule();
model.MyName = "My Name";
return View(model);
}
困惑
当我提交第一次。
我得到的输出象下面
和形式展示这样。问题是 - ？为什么指数字来两次
and form show like this. Question is - Why is index word coming two times?
当我点击第二次，形式外观保持不变，输出显示如下图所示。
When I click second time, form appearance remains same and output shows like below.
问题 - 为什么Jquery的到来了这么多次
Question - Why is Jquery coming so many times ?
推荐答案
您可以使用 Ajax.BeginForm 而不是常规的形式。但是，首先你应该确定你想要的AJAX调用后进行更新，你的页面的部分。
You could use an Ajax.BeginForm instead of a regular form. But first you should decide which section of your page you want to be updated after the AJAX call.
让我们假设以下情形：如果AJAX调用成功要更新一些结果你的DOM的某些部分，如果AJAX失败，你要更新的形式，而是显示错误消息：
Let's suppose the following scenario: if the AJAX call is successful you want to update some section of your DOM with some result and if the AJAX fails you want to update the form and display the error message instead.
要通过将表单内实现这个你可以开始部分（ _MyForm.cshtml ）
To implement this you could start by placing the form inside a partial (_MyForm.cshtml):
@model _1.Models.HomeModels
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "myForm" }))
{
@Html.LabelFor(i => i.MyName)
@Html.TextBoxFor(i => i.MyName)
@Html.ValidationMessageFor(i => i.MyName)
<input type="submit" value="Click here" id="btn" />
}
@if (Model.SomeResultProperty != null)
{
<div>@Model.SomeResultProperty</div>
}
然后你可以有你的主视图参考此部分：
and then you could have your main view reference this partial:
@model _1.Models.HomeModels
<div id="myForm">
@Html.Partial("_MyForm", Model)
</div>
下一步是更新您的控制器动作将处理AJAX调用：
The next step is to update your controller action that will handle the AJAX call:
[HttpPost]
public ActionResult Index(HomeModels model)
{
if (ModelState.IsValid)
{
// validation succeeded => we could set the result property
// on the model to be displayed:
model.SomeResultProperty = "this is the result";
}
return PartialView("_MyForm", model);
}
最后你需要在为了使 Ajax.BeginForm jquery.unobtrusive-ajax.js 脚本到您的网页C $ C>辅助工作：
and finally you need to include the jquery.unobtrusive-ajax.js script to your page in order for the Ajax.BeginForm helper to work:
<script type="text/javascript" src="@Url.Content("~/scripts/jquery.unobtrusive-ajax.js")"></script>
这篇关于当我通过可以保留文本框填充/空的，在这两种情况下，众目睽睽之下被加载提交的局部视图。我怎么能叫阿贾克斯后呢？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
