Question

原谅我，我是MVC和AJAX的新手。

目前我只是提交一个表单，我想使用表单中的数据来使用ajax在局部视图中更新表。

我的_UserInfo部分视图如下所示：

@model IEnumerable<Dashboard.Models.UserInfo>
<table>
    <tr>
        <th>
           Firstname
        </th>
        <th>
           Lastname
        </th>
        <th>
            EmailAddress
        </th>
        <th>
        </th>
    </tr>
@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.firstName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.surname)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.emailAddress)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.SAMuserName)
        </td>
    </tr>
}
</table>

我的主要User视图如下所示：

@model Dashboard.Models.User
@Scripts.Render("~/bundles/jqueryval")

@using (Ajax.BeginForm("_UserInfo", "User", new AjaxOptions()
                        {
                            HttpMethod = "GET",
                            UpdateTargetId = "results",
                            InsertionMode = InsertionMode.Replace
                        }))
{

    <fieldset>
    //...My Form 

        <p>
            <input type="submit" value="Find" />
        </p>
    </fieldset>
}

<div id="results">
</div>

最后这是我的UserController：

public PartialViewResult UserResults(User person)
{
    UserInfo personInfo = new UserInfo();

    //....Doing stuff

    return PartialView("_userInfo", personInfo);
}

现在我知道这可能并不好。但这是我用我的小知识尝试过的最好的尝试。

当我单击“用户”视图上的按钮时，我收到404错误，指出无法找到_UserInfo。

我相信我所有问题的根源都在

 @using (Ajax.BeginForm("_UserInfo", "User", new AjaxOptions()
                        {
                            HttpMethod = "GET",
                            UpdateTargetId = "results",
                            InsertionMode = InsertionMode.Replace
                        }))

但据我所知，我不知道出了什么问题。

* 编辑： *正如我所指出的那样，我错误地创建了我的HTML表单。我已将其改为

@using（Ajax.BeginForm（＆＃34; UserResults＆＃34;，＆＃34; User＆＃34;，new AjaxOptions（）{...}

我的行动现在被召唤！但是，我的部分视图未加载到屏幕上。

Answer 1

对于特定的重载，前两个字符串是ActionName和ControllerName MSDN。因此，它应该如此镜像您的控制器：

@using (Ajax.BeginForm("userResults", "User", new AjaxOptions()
                    {
                        HttpMethod = "GET",
                        UpdateTargetId = "results",
                        InsertionMode = InsertionMode.Replace
                    }))

此外，值得注意的是，在以下命名约定中，userResults应该重命名为UserResults

修改确保您使用的是Ajax.BeginForm（请参阅更新），并且您还在包中添加了ajax不显眼的脚本。在BundleConfig.RegisterBundles中，您应该添加以下bundle。

bundles.Add(new ScriptBundle("~/bundles/jquery").Include( "~/Scripts/jquery-{version}.js")); bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( "~/Scripts/jquery.unobtrusive*"));

在HTML中，确保调用两个捆绑包。

@Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryval")

Answer 2

你需要使用Ajax.BeginForm而不是Html.BeginForm

@using (Ajax.BeginForm("userResults", "User", new AjaxOptions()
                {
                    HttpMethod = "GET",
                    UpdateTargetId = "results",
                    InsertionMode = InsertionMode.Replace
                }));

Answer 3

代码看起来不错。有必要添加脚本：

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include("~/Scripts/jquery.unobtrusive*"));

@model Dashboard.Models.User
@Scripts.Render("~/bundles/jqueryval")

@using (Ajax.BeginForm("_UserInfo", "User", new AjaxOptions()
                        {
                            HttpMethod = "GET",
                            UpdateTargetId = "results",
                            InsertionMode = InsertionMode.Replace
                        }))
{

    <fieldset>
    //...My Form 

        <p>
            <input type="submit" value="Find" />
        </p>
    </fieldset>
}

<div id="results">
</div>

现在，您的代码可以正常运行。

使用AJAX加载部分视图不起作用

3 个答案: