ASP.NET MVC4가 PagedList.Mvc를 사용하여 페이징 기능을 구현하는 방법에 대한 샘플 코드

이 글에서는 주로 PagedList.Mvc 페이징을 사용하는 ASP.NET MVC 4의 구현 코드를 소개합니다. 여기에는 특정 참조 값이 있습니다. 관심 있는 친구는 이를 참조할 수 있습니다.

ASP.NET MVC에서 페이징을 수행하는 방법에는 여러 가지가 있으며, NuGet은 페이징을 위해 PagedList 및 PagedList.Mvc를 사용합니다.

참조 PagedList.Mvc를 설치하면 참조 PagedList가 설치됩니다.

코드를 복사하세요코드는 다음과 같습니다.

 @Html.PagedListPager((PagedList.IPagedList<SampleInfo>)ViewBag.Models, 
 page => Url.Action("Index", new { page, keyword = Request["keyword"], datemin = Request["datemin"], datemax = Request["datemax"] }))

검색 트리거 이벤트:

 <input type="text" id="datemin" class="input-text Wdate" style="width:60px;" value="@Request["datemin"]">
 <input type="text" id="datemax" class="input-text Wdate" style="width:60px;" value="@Request["datemax"]">
 <input type="text" class="input-text" style="width:250px" placeholder="输入关键词" id="keyword" name="" value="@Request["keyword"]">
 <button type="submit" class="btn btn-success" id="" name="" onclick="search()"><i class="icon-search"></i> 搜索</button>

 <script>
 function search() {
  var url = "?type=1";
  if ($("#keyword").val() != "") {
   url += "&keyword=" + $("#keyword").val();
  }
  if ($("#datemin").val() != "") {
   url += "&datemin=" + $("#datemin").val();
  }
  if ($("#datemax").val() != "") {
   url += "&datemax=" + $("#datemax").val();
  }
  window.location.href = "/Admin/SampleInfo/Index"+url;
 }
 </script>

백그라운드 방법:

IQueryable<SampleInfo> models = db.SampleInfoBLL.GetAllEntities().Where(d => d.IsDel == false);
if (!String.IsNullOrEmpty(Request["keyword"]))
{
string keyword = Request["keyword"];
models = models.Where(d => d.Site_Chinese.Contains(keyword));
}
if (!String.IsNullOrEmpty(Request["datemin"]))
{
int datemin = Convert.ToInt32(Request["datemin"]);
models = models.Where(d => Convert.ToDouble(d.Lon_Degree) >= datemin);
}
if (!String.IsNullOrEmpty(Request["datemax"]))
{
int datemax = Convert.ToInt32(Request["datemax"]);
models = models.Where(d => Convert.ToDouble(d.Lat_Degree) <= datemax);
}
int page = 1;
if (Request["page"] != null)
{
page = Convert.ToInt32(Request["page"]);
}
ViewBag.ModelsCount = models.Count();
ViewBag.Models = models.OrderBy(d => d.SampleInfoID).ToPagedList(page, 10);

페이지 매김 제어 스타일:

.pagination {
 display: inline-block;
 padding-left: 0;
 margin: 20px 0;
 border-radius: 4px;
}

.pagination > li {
 display: inline;
}

.pagination > li > a,
.pagination > li > span {
 position: relative;
 float: left;
 padding: 6px 12px;
 margin-left: -1px;
 line-height: 1.428571429;
 text-decoration: none;
 background-color: #ffffff;
 border: 1px solid #dddddd;
}

.pagination > li:first-child > a,
.pagination > li:first-child > span {
 margin-left: 0;
 border-bottom-left-radius: 4px;
 border-top-left-radius: 4px;
}

.pagination > li:last-child > a,
.pagination > li:last-child > span {
 border-top-right-radius: 4px;
 border-bottom-right-radius: 4px;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
 background-color: #eeeeee;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
 z-index: 2;
 color: #ffffff;
 cursor: default;
 background-color: #428bca;
 border-color: #428bca;
}

.pagination > .disabled > span,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
 color: #999999;
 cursor: not-allowed;
 background-color: #ffffff;
 border-color: #dddddd;
}

.pagination-lg > li > a,
.pagination-lg > li > span {
 padding: 10px 16px;
 font-size: 18px;
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
 border-bottom-left-radius: 6px;
 border-top-left-radius: 6px;
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
 border-top-right-radius: 6px;
 border-bottom-right-radius: 6px;
}

.pagination-sm > li > a,
.pagination-sm > li > span {
 padding: 5px 10px;
 font-size: 12px;
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
 border-bottom-left-radius: 3px;
 border-top-left-radius: 3px;
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
 border-top-right-radius: 3px;
 border-bottom-right-radius: 3px;
}

.pager {
 padding-left: 0;
 margin: 20px 0;
 text-align: center;
 list-style: none;
}

.pager:before,
.pager:after {
 display: table;
 content: " ";
}

.pager:after {
 clear: both;
}

.pager:before,
.pager:after {
 display: table;
 content: " ";
}

.pager:after {
 clear: both;
}

.pager li {
 display: inline;
}

.pager li > a,
.pager li > span {
 display: inline-block;
 padding: 5px 14px;
 background-color: #ffffff;
 border: 1px solid #dddddd;
 border-radius: 15px;
}

.pager li > a:hover,
.pager li > a:focus {
 text-decoration: none;
 background-color: #eeeeee;
}

.pager .next > a,
.pager .next > span {
 float: right;
}

.pager .previous > a,
.pager .previous > span {
 float: left;
}

.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
 color: #999999;
 cursor: not-allowed;
 background-color: #ffffff;
}
.pagination-container {
 text-align: center;
}

페이지 매김 스타일 효과:

위 내용은 ASP.NET MVC4가 PagedList.Mvc를 사용하여 페이징 기능을 구현하는 방법에 대한 샘플 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!