Question

我对此感到疯狂......我一直在试图弄清楚如何使用ajax来更新部分视图已经有一段时间......我必须要失踪简单易行的东西。

我在VS2012，MVC4。

首先，我确实加载了这些包：

@Styles.Render("~/css") 
@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/js" ) 
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/jqueryval")

我也尝试手动指定不显眼的脚本......

然后我认为这是：

            @using (Ajax.BeginForm("Index_AddGroup", new AjaxOptions { UpdateTargetId = "AddGroupList" }))
        { 
            <div>
                @Html.LabelFor(model => Model.NewGroups.GroupName)
            </div>
            <div>
                @Html.DropDownListFor(model => Model.AllGroups.nSelectGroupID, Model.AllGroups.GroupList, "Select Group to Add")
                <input type="submit" value="Add Group" /> 
            </div>
        }

然后我加载局部视图：

            <div id="AddGroupList">
            @if(Model.Groups != null)
            {
                @Html.Partial("_AddGroups", Model.Groups);
            }
        </div>

在该局部视图中，我执行以下操作：

@model IEnumerable<MyApp.ViewModels.Group>

@{
    ViewBag.Title = "Added Groups";
}

<h2>Groups to be Added</h2>

<table>
    <tr>
        <th>Group Name</th>
        <th>Added until</th>
    </tr>
@foreach (var item in Model)
{ 
    <tr>
        <td>@Html.DisplayFor(model=>item.GroupName)</td>
        <td>@Html.DisplayFor(model=>item.EndDate)</td>
    </tr>
}

控制器：

        [HttpPost]
    public ActionResult Index_AddGroup(SearchedUser viewModel)
    {
        AddGroupsContext db = new AddGroupsContext();

        Group NewGroup = new Group();
        NewGroup.GroupName = "test";//viewModel.

        db.Groups.Add(NewGroup);
        db.SaveChanges();

        return PartialView("_AddGroups", db.Groups);
    }

我装了小提琴并点击按钮但没有发送请求。为什么javascript / ajax代码没有运行？

Answer 1

我认为你需要一个提交按钮。尝试：

<input type="submit" value="Add Group" />

此外，我认为您需要添加一个引用，因为它看起来不包含在任何地方：

jquery.unobtrusive-ajax.js

如果你还没有它，我想你可以通过nuget获得它。

否则这里是一个包含CDN链接的脚本标记：

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.js"></script>

Ajax表单不提交和更新部分视图

1 个答案: