PagedList可以用来自动切换页面吗?

本文关键字：换页 PagedList | 更新日期: 2023-09-27 17:54:51

我正在使用asp.net-mvc，我有一个PageList从https://github.com/TroyGoode/PagedList在我的项目中，它的工作很好，但我希望能够在设置的时间间隔自动切换页面。我正在使用的页面有一组手风琴项目，我想知道如何在没有人工交互的情况下切换页码。比如使用pagedList的幻灯片。有更好的办法吗?

我Index.cshtml

@model PagedList.IPagedList<ComputerDownTimeTracker.Models.DashboardTicketListVM>
@using PagedList.Mvc;
<body>
<div class="list1">
    <div id="accordion">
        @foreach (var item in Model)
        {
           <div class="header">
                <b> Equipment: </b>@item.ComputerName <br />
                <b> Location: </b>@item.Location
                @switch (item.RunningStatus)
                {
                    case 1: imagePath = down;
                        break;
                    case 2: imagePath = running;
                        break;
                    case 3: imagePath = waiting;
                        break;
                    case 4: imagePath = waiting;
                        break;
                    default: imagePath = running;
                        break;
                }
                <img class="status" src="@imagePath" alt="" />

                <ul class="timeStat">
                    <li><b class="time">Computer Down At :</b> @item.OnClickTimeStamp</li>

                    @if (@item.RunningStatus == 4)
                    {
                        <li> <b class="time"> Maintenance On issue :</b> @item.EditTimeStamp</li>
                    }
                    @if (@item.RunningStatus == 3)
                    {
                        <li> <b class="time">Waiting For Parts :</b> @item.EditTimeStamp</li>
                    }
                    @if (@item.RunningStatus == 2)
                    {
                        <li> <b class="time">Computer Restarted :</b> @item.EditTimeStamp</li>
                    }
                </ul>
            </div>@*//computer name and status div*@
            <div><p>@Html.Raw(@item.ComputerStatus)</p></div>
        }

        @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount
        @Html.PagedListPager(Model, page => Url.Action("Index",new { page }))
    </div>
</div>

My Home controller index method

    public ActionResult Index(int? page)
    {
        var time = DateTime.Now;
        time = time.AddSeconds(-100); 
        var ViewModel = _ComputerDB.Database.SqlQuery<DashboardTicketListVM>(listQuery).ToList();
        var remove_running = ViewModel.Where(x => x.OnRestartTimeStamp >= time || x.OnRestartTimeStamp == null);
        int pageSize = 8;
        int pageNumber = (page ?? 1);

        return View("Index", "~/Views/Shared/_ListLayout.cshtml", remove_running.ToPagedList(pageNumber, pageSize));
    }

我省略了很多不相关的东西

PagedList可以用来自动切换页面吗?

您需要使用use Javascript setTimeout在指定时间后重新加载下一页

使用PagedList示例:

<标题>控制器h1> 视图

@{
    ViewBag.Title = "Product Listing"
}
@using PagedList.Mvc; //import this so we get our HTML Helper
@using PagedList; //import this so we can cast our list to IPagedList (only necessary because ViewBag is dynamic)
<!-- import the included stylesheet for some (very basic) default styling -->
<link href="/Content/PagedList.css" rel="stylesheet" type="text/css" />
<!-- loop through each of your products and display it however you want. we're just printing the name here -->
<h2>List of Products</h2>
<ul>
    @foreach(var product in ViewBag.OnePageOfProducts){
        <li>@product.Name</li>
    }
</ul>
<!-- output a paging control that lets the user navigation to the previous page, next page, etc -->
@Html.PagedListPager( (IPagedList)ViewBag.OnePageOfProducts, page => Url.Action("Index", new { page }) )

<标题>查看Javascript h1> 意:您可能需要添加一些额外的逻辑，以确保在到达页面末尾时停止下一个页面的加载。您可以通过检查PagedList提供的HasNextPage属性来做到这一点。

的例子:

<script type="text/javascript">
    var hasNextPage = @(((IPagedList)ViewBag.OnePageOfProducts.HasNextPage) ? "true" : "false");
    if(hasNextPage) {
        var nextPage = @(((IPagedList)ViewBag.OnePageOfProducts.PageNumber) + 1); // next page number is current page number + 1
        setTimeout(function() {
            window.location = "index?page=" + nextPage; // load new page after timeout
        }, (5 * 1000) /* set timeout here, example: 5 seconds */);
    }
</script>

相关文章：

最新信息: