在模式弹出窗口上使用X.PagedList

问题描述 投票:0回答:1

我在页面上弹出了一个模式对话框:

...
<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="companySearchModal" aria-hidden="true" id="companySearchModal"> 
      <div class="modal-dialog" role="document"> 
         <div class="modal-content"> 
           <div id="companySearchModalContent"></div> 
         </div><!-- /.modal-content --> 
     </div><!-- /.modal-dialog --> 
   </div><!-- /.modal -->
...

我弹出:

...
    $('#companySearchModalContent').html(data); 
    $('#companySearchModal').modal(options); 
    $('#companySearchModal').modal('show');
...

在该模式对话框中,我在底部设置中显示具有此PagedListPager的公司列表:

<div>
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount

    <div id="companySearchPager">
        @Html.PagedListPager(
                                Model,
                                page => Url.Action("CompanySearch",
                                                   "Admin",
                                                     new
                                                          {
                                                              sortOrder = ViewBag.CurrentSort,
                                                              currentFilter = ViewBag.CurrentFilter,
                                                              page = page
                                                     }),
                                PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing(
                                    new AjaxOptions
                                        {
                                            HttpMethod = "GET",
                                            UpdateTargetId = "companySearchModalContent"
                                        }
                                    )
                                )
    </div>
</div>

当我单击由[[PagedListPager控件呈现的给定页面元素时,它会按Url。“中的指定从控制器” Admin“调用动作” CompanySearch“。 Action,但是它呈现PartialView,它本身在整个页面上全部返回,而不是将部分视图注入到“#companySearchModalContent” Div中,我将其设置为UpdateTargetIdPagedListRenderOptions.EnableUnobtrusiveAjaxReplacing调用的AjaxOptions中。

我认为PagedListPager可以做到这一点。我添加了一些jQuery代码来调用适当的Ajax注入“

$('#companySearchModalContent')。html(data);

”,但是我没有办法获取页码,搜索和排序参数以及用户从寻呼机控件中单击,并且不知道如何在.ajax代码块中正确设置url和data$('#companySearchPager').click(function (e) { e.preventDefault(); $.ajax({ type: 'GET', // How to get the page value the user clicked on? // data: {"page": #}, // How to get the url? This would work if I could get the page #. // url: '@Url.Action("CompanySearch", "Admin")', success: function (data) { debugger; $('#companySearchModalContent').html(data); }, error: function () { showAlert("Employer content load failed.", "warning", 5000); } }); return false; });
我希望PageListPager能够使该“ $('#companySearchModalContent')。html(data);”我已经在PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing调用的AjaxOptions中设置了UpdateTargetId。

感谢您的帮助...

我在页面上弹出了一个模式弹出窗口:...

] >>
修复了最新帖子!

已添加

<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

在页面顶部。
javascript jquery ajax pagedlist
1个回答
0
投票
修复了最新帖子!
© www.soinside.com 2019 - 2024. All rights reserved.