zoukankan      html  css  js  c++  java
  • C#_Ajax分页MVCPager

    UCJqOrderList

        @model PagedList<Order>
    <div id="dvOrders">
    <table width="98%">
    <tr><th>订单编号</th><th>订单日期</th><th>顾客编号</th><th>收货地址</th></tr>
    @foreach(Order od in Model)
     {     
         <tr><td>@od.OrderID</td><td>@od.OrderDate.ToString()</td><td>@od.CustomerID</td>
         <td>@od.ShipAddress</td></tr>   
     } 
    </table>
    <p>Ajax分页(仅刷新部分页面,Url不改变):</p>
    @Html.AjaxPager(Model, new PagerOptions() { PageIndexParameterName = "id", ShowDisabledPagerItems = false, AlwaysShowFirstLastPageNumber = true }, new AjaxOptions { UpdateTargetId = "dvOrders"})
    <p>标准url分页(刷新整个页面,Url改变):</p>
    @Html.Pager(Model, new PagerOptions { PageIndexParameterName = "id", ShowDisabledPagerItems = false, AlwaysShowFirstLastPageNumber = true })
    </div>

    JqAjaxOrders

    @{ ViewBag.Title = "MvcPager 使用 jQuery 分页示例";}
        @model PagedList<Order>
    
    <script type="text/javascript" src="/Scripts/jquery-1.5.1.min.js"></script>
    <script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
    <h2>ASP.NET MvcPager 使用 jQuery 分页示例</h2>
        <div>本示例演示使用MvcPager配合<a href="http://www.jquery.com" target="_blank">jQuery</a>实现Ajax分页。</div><br />   
    @{Html.RenderPartial("UCJqOrderList", Model); }
         public ActionResult JqAjaxOrders(int id = 1)
            {
                using (var db = new OrderEntities())
                {
                    PagedList<Order> orders = db.Orders.OrderBy(o => o.OrderID).ToPagedList(id, 20);
                    if (Request.IsAjaxRequest())
                        return PartialView("UCJqOrderList", orders);
                    return View(orders);
                }
            }
    
  • 相关阅读:
    Dropdown 下拉菜单
    Breadcrumb 面包屑
    Tabs 标签页
    NavMenu 导航菜单
    Notification 通知
    MessageBox 弹框
    Message 消息提示
    Loading 加载
    Alert 警告
    Badge 标记
  • 原文地址:https://www.cnblogs.com/MarchThree/p/3751862.html
Copyright © 2011-2022 走看看