使用AJAX加载的局部视图不工作 [英] Using AJAX to load a partial view not working

问题描述

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

Forgive me, I am new to MVC and AJAX.

目前我只是提交表单，我想用数据的形式使用Ajax的局部视图更新表。

Currently I am simply submitting a form, and I want to use the data from the form to update a table in a partial view using ajax.

我的 _UserInfo 部分观点是这样的：

My _UserInfo partial view looks like this:

@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>

我的主用户看法是这样的：

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

---

现在我知道这可能心不是很好。但是，这是最好的尝试，我曾尝试与我的小知识。

---

Now I know this probably isnt good. But this is the best attempt I have tried with my little knowledge.

当我点击用户视图按钮，我得到一个404错误，指出_UserInfo无法找到。

When I click the button on the User view, I am getting a 404 error saying that _UserInfo cannot be found.

我相信，我的所有问题的根源是

I believe that the source of all of my issues is in

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

但我的知识，我不知道什么是错的。

But with my knowledge, I don't know what is wrong.

*的编辑：的*因为已经向我指出，我被错误地创建我的HTML表单。因为我已经改成了

**As it has been pointed out to me, I was creating my HTML form incorrectly. I have since changed it to

@using（Ajax.BeginForm（UserResults，用户，新   AjaxOptions（）{...}

@using (Ajax.BeginForm("UserResults", "User", new AjaxOptions(){...}

我的行动现在被称为！然而，我的部分观点没有被加载到屏幕上。

My action is now being called! However, my partial view is not being loaded onto the screen.

推荐答案

有关特定的过载，前两个字符串是ActionName和ControllerName <一href="http://msdn.microsoft.com/en-us/library/system.web.mvc.html.formextensions.beginform%28v=vs.108%29.aspx"相对=nofollow> MSDN 。因此，它应该反映你的控制器，像这样：

For your specific overload, the first two strings are ActionName and ControllerName MSDN. As such, it should mirror your controller like so:

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

此外，值得一提的是，在下面的命名约定，userResults应该改名为UserResults

In addition, it's worth noting that in following naming conventions, userResults SHOULD be renamed to UserResults

编辑： 请确保您同时使用Ajax.BeginForm（见更新），并且您也已经包含了AJAX不显眼的脚本到你的包。在BundleConfig.RegisterBundles，你应该有后续的包的补充。

Make sure that you are using both Ajax.BeginForm (see update) and that you also have included the ajax unobtrusive script into your bundle. In BundleConfig.RegisterBundles, you should have the follow bundle addition.

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

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

而在你的HTML，确保两个包被调用。

And in your HTML, make sure both bundles are called.

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

这篇关于使用AJAX加载的局部视图不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！