asp.net-mvc-3 - 部分 View 呈现为完整 View

Question

MVC 3、ajax、c#

我的部分 View 呈现为新页面，而不是替换搜索结果表。

Controller :

public class SearchController : Controller
{
    //
    // GET: /Search/
    private myEntities db = new myEntities();
    private Repository repo = new Repository();

    [HttpGet]
    public ActionResult Index()
    {
        var model = new List<PersonViewModel>();

        model = repo.GetPeople();

        return View(model);
    }




    public PartialViewResult _SearchResult(string fname, string lname)
    {
        var personResult = repo.GetSearchResult(fname, lname);

        return PartialView("_SearchResult", personResult);
    }

}

View :

<div class="page">

    <div class="middle-col-comment-mod">
                <h2>Search Existing Trespassers</h2>

        <div id="search">
            @using (Ajax.BeginForm("_SearchResult", "Search", null, new AjaxOptions { HttpMethod = "Post", InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, UpdateTargetId = "indexSearchResults" }))
            {
                <div class="editor-field">   
                    <label>First Name:</label>
                    @Html.TextBox("FirstName")

                    <label style = "margin-left: 15px;">Last Name:</label>
                    @Html.TextBox("LastName", "", new { style = "margin-right: 15px;" })

                    <input type="submit" name="submit" class="skbutton" value="Search" />

                </div>

            }

        </div>

                    <table id="indexSearchResults" class="data-table">
                        <tr>
                            <th>
                                FirstName
                            </th>
                            <th>
                                LastName
                            </th>
                            <th>
                                Gender
                            </th>
                            <th>
                                City
                            </th>
                            <th>
                                DOB
                            </th>
                            <th>
                                IsStudent
                            </th>
                            <th>
                                Actions
                            </th>
                        </tr>

                    @if (Model.Count() == 0)
                    {
                          <tr>
                            <td colspan=7>
                                There are currently no trespassers in the trespass database.
                            </td>
                          </tr>
                    }
                    else
                    {
                    foreach (var item in Model)
                    {
                        <tr>
                                 <td>
                                @Html.DisplayFor(modelItem => item.FirstName)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.LastName)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.Gender)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.DOB)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.School)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.IsStudent)
                            </td>

                            <td>
                                @Html.ActionLink("Edit", "Edit", new { id = item.PersonId }) |
                                @Html.ActionLink("Details", "Details", new { id = item.PersonId }) |
                                @Html.ActionLink("Delete", "Delete", new { id = item.PersonId })
                            </td>
                        </tr>
                    }
                    }
                    </table>

            </div>
    </div>

以及部分 View :

@model IEnumerable<TrespassTracker.Models.PersonViewModel>

<table>
    <tr>
        <th>
            First Name
        </th>
        <th>
            Last Name
        </th>
        <th>
            Gender
        </th>
        <th>
            Date of Birth
        </th>
        <th>
            Is a Student?
        </th>
        <th>
            Actions
        </th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.FirstName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.LastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Gender)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.DOB)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.IsStudent)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
            @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
        </td>
    </tr>
}

</table>

        <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

根据我的研究，我发现通常的嫌疑是部分中缺少 jquery 脚本的链接，但我有这个。我检查了我的婚礼开发工具上的网络选项卡，发现它正在被调用。还有什么问题可能吗？

Answer 1

脚本不会引起任何问题，我在这里看到的唯一错误是表格。您正在尝试用返回表的其他表填充该表，请使用 div 来更新 ajax 表单(搜索结果):

<div id="indexSearchResults">
   <table>
     ..........
   </table>
</div>