MVC中的AJAX搜索框

时间:2016-10-01 15:16:20

标签: ajax asp.net-mvc

我在让我的AJAX请求在我的MVC项目中工作时遇到了一些麻烦。

目前,搜索功能正常运行 - 我从我的数据中获得了预期的结果。但是当按下提交按钮时,浏览器将被重定向到" SearchPhilosophers" view - 调用相同名称的方法。但我不明白为什么会发生这种情况,因为声明该方法仅返回部分视图。

这里是PhilosophersController.cs中的方法:

    public PartialViewResult SearchPhilosophers (string keyword)
    {
        var data = db.Philosophers.Where(p =>p.LastName.StartsWith(keyword)).ToList();
        return PartialView(data);
    }

这是索引视图文件:

    @model IEnumerable<MVCPhilosopher.Models.Philosopher>

@{
    ViewBag.Title = "Index";
    AjaxOptions options = new AjaxOptions
    {
        HttpMethod = "GET",
        UpdateTargetId = "searchResult",
        InsertionMode = InsertionMode.Replace,
    };
}
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<h2>@ViewBag.Title</h2>

<div class="container">
    <div class="row">
    @foreach (var philosopher in Model)
    {
        <div class="col-md-4">
            <a href="@Url.Action("Details", new { id = philosopher.Id })">
                <img src="/Images/@philosopher.ImgFile"
                     alt="@philosopher.FullName"
                     class="img-responsive" height="400" width="160"/>
            </a>
            <h3>@Html.ActionLink(philosopher.FullName, "Details",
                   new { id = @philosopher.Id })</h3>
        </div>
    }
    </div>
</div>
<table>
    <tbody id="searchResult">
        @Html.Action("SearchPhilosophers", new { keyword = "" })
    </tbody>
</table>
@using (Ajax.BeginForm("SearchPhilosophers", options))
{
    <div>
        @Html.TextBox("keyword", null, new {id = "Search"})
        <input type="submit" value="Search" class="btn btn-primary" />
    </div>
}

SearchPhilosphers局部视图非常简单:

@model IEnumerable<MVCPhilosopher.Models.Philosopher>

@foreach(var p in Model)
{
    <h2>@p.LastName</h2>
}

请有人解释我的新页面正在被请求且AJAX请求是否在同一页面上工作?

0 个答案:

没有答案