0

我在 MVC3 中有 Area ,如下所述。

在此处输入图像描述

模型

public class AdminModule
{
    [Display(Name = "MyName")]
    [Required(ErrorMessage = "MyName is missing")]
    public String MyName { get; set; }
}

我有以下代码的部分视图。

@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);
}

混乱

当我第一次提交。

我得到如下输出

在此处输入图像描述

和这样的形式显示。问题是 -为什么索引词会出现两次?

在此处输入图像描述

当我第二次单击时,表单外观保持不变,输出如下所示。

问题 - 为什么 Jquery 来了这么多次?

在此处输入图像描述

4

2 回答 2

1

您可以使用 anAjax.BeginForm而不是常规形式。但首先您应该决定在 AJAX 调用之后要更新页面的哪个部分。

让我们假设以下场景:如果 AJAX 调用成功,您想用一些结果更新 DOM 的某些部分,如果 AJAX 失败,您想更新表单并显示错误消息。

要实现这一点,您可以首先将表单放在部分 ( _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>
}

然后你可以让你的主视图引用这个部分:

@model _1.Models.HomeModels
<div id="myForm">
    @Html.Partial("_MyForm", Model)
</div>

下一步是更新将处理 AJAX 调用的控制器操作:

[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);
}

最后,您需要将jquery.unobtrusive-ajax.js脚本包含到您的页面中,以便Ajax.BeginForm帮助程序工作:

<script type="text/javascript" src="@Url.Content("~/scripts/jquery.unobtrusive-ajax.js")"></script>
于 2013-02-04T20:27:07.480 回答
0

请改用 Ajax.BeginForm。

您是否在页面中引用了验证脚本?

于 2013-02-04T18:22:22.947 回答