在mvc中对PagedList分页进行Ajax化无法正常工作

时间:2015-01-22 11:01:37

标签: jquery ajax asp.net-mvc asp.net-mvc-4 pagedlist

我正在尝试在mvc 4 PagedList中进行Ajax化分页。请参阅以下pager html div的输出

<div id="myPager">
  <div class="pagination-container">
    <ul class="pagination">
      <li class="disabled PagedList-pageCountAndLocation"><a>Page 1 of 2.</a>/li>
      <li class="active"><a>1</a></li><li><a href="/Request/ManageRequest?page=2&amp;searchFilter=1&amp;RequestId=1">2</a></li>
      <li class="PagedList-skipToNext"><a href="/Request/ManageRequest?page=2&amp;searchFilter=2&amp;RequestId=2" rel="next">»</a></li>
    </ul>
  </div>
</div>

实际的局部视图具有以下页面标记标记

        <div id="myPager">
            @Html.PagedListPager(Model, page => Url.Action("ManageRequest", new { page, searchTerm = ViewBag.SearchTerm, searchFilter = ViewBag.SearchFilter }), new PagedListRenderOptions
               {
                   EllipsesFormat = "&#8230;",
                   LinkToFirstPageFormat = "««",
                   //more options                       

               })
        </div>

我的控制器Action方法有以下签名

   public virtual PartialViewResult SearchResults(string searchTerm, string searchFilter, int? page)
    {
       //some processing
    return PartialView("_SearchResults", SearchResults.ToPagedList(page ?? 1, 10));
    }

我的jquery ajax脚本

<script type="text/javascript">
$(document).ready(function () {
     $('#myPager').on('click', 'a', function () {
        $.ajax({
            type: "GET",
            traditional: true,
            cache: false,
            url: '@Url.Action("SearchResults", "Request")',
            data: { searchTerm: $("#searchTerm").val(), searchFilter: $("#searchFilter").val() },

        })
        .success(function (data) {
            $('#Results').empty().html(data);

        })
        .error(function () {

        });
        return false;
    });
});

当我们点击页面时,会发生什么?r Ajax点击从不被调用,控件转到实际链接,如下所示

http://localhost:60784/Request/ManageRequest?page=2&searchFilter=RequestId

有什么想法吗?感谢

0 个答案:

没有答案