标签:
分页样式插件http://www.jq22.com/plugin/2705
前台引用:
1 <script src="~/kkpager/lib/jquery-1.8.2.min.js"></script> 2 <script src="~/kkpager/src/kkpager.js"></script> 3 <link href="~/kkpager/src/kkpager_blue.css" rel="stylesheet" />
模糊搜索框:
1 <form action="@Url.Action("Select")" method="get"> 2 <input id="a" name="a" type="search" /> 3 <input type="submit" value="search" /> 4 </form>
数据:
<ul id="Page"> @Html.Raw(ViewData["list"].ToString()) </ul>
js代码:
1 <script type="text/javascript"> 2 function getParameter(name) { 3 var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 4 var r = window.location.search.substr(1).match(reg); 5 if (r != null) return unescape(r[2]); return null; 6 } 7 8 //init 9 $(function () { 10 var totalPage = @ViewData["pageCount"]; 11 var totalRecords = @ViewData["totalCount"]; 12 var pageNo = getParameter(‘pno‘); 13 if (!pageNo) { 14 pageNo = 1; 15 } 16 //生成分页; 17 //有些参数是可选的,比如lang,若不传有默认值 18 kkpager.generPageHtml({ 19 pno: pageNo, 20 //总页码 21 total: totalPage, 22 //总数据条数 23 totalRecords: totalRecords, 24 mode: ‘click‘,//默认值是link,可选link或者click 25 click: function (n) { 26 // do something 27 //手动选中按钮 28 this.selectPage(n); 29 $.ajax({ 30 type: ‘POST‘, 31 url: ‘@Url.Action("Select")‘, 32 data:{page:n}, 33 success: function(e){ 34 $("#Page").html(‘‘).append(e); 35 } 36 }); 37 return false; 38 } 39 /* 40 ,lang : { 41 firstPageText : ‘首页‘, 42 firstPageTipText : ‘首页‘, 43 lastPageText : ‘尾页‘, 44 lastPageTipText : ‘尾页‘, 45 prePageText : ‘上一页‘, 46 prePageTipText : ‘上一页‘, 47 nextPageText : ‘下一页‘, 48 nextPageTipText : ‘下一页‘, 49 totalPageBeforeText : ‘共‘, 50 totalPageAfterText : ‘页‘, 51 currPageBeforeText : ‘当前第‘, 52 currPageAfterText : ‘页‘, 53 totalInfoSplitStr : ‘/‘, 54 totalRecordsBeforeText : ‘共‘, 55 totalRecordsAfterText : ‘条数据‘, 56 gopageBeforeText : ‘ 转到‘, 57 gopageButtonOkText : ‘确定‘, 58 gopageAfterText : ‘页‘, 59 buttonTipBeforeText : ‘第‘, 60 buttonTipAfterText : ‘页‘ 61 }*/ 62 }); 63 }); 64 </script>
控制器:
1 Models.VideoEntities3 db = new Models.VideoEntities3(); 2 public ActionResult Select(string a, int page = 1) 3 { 4 int totalCount = 0;//数据总数 5 int pageCount = 0;//页数 6 const int PageSize = 8;//页面size 7 List<Video.Models.Video> list; 8 9 10 list = GetVideo(page, PageSize, ref totalCount,a).ToList(); 11 12 pageCount = totalCount % PageSize == 0 ? totalCount / PageSize : totalCount / PageSize + 1; 13 //把页数和数据总数发送到前台 14 ViewData["totalCount"] = totalCount; 15 ViewData["pageCount"] = pageCount; 16 System.Text.StringBuilder sb = new System.Text.StringBuilder(); 17 foreach (Video.Models.Video item in list) 18 { 19 sb.Append("<li>"); 20 sb.Append("<a href=‘/Video/Details/"+item.VideoId+"‘>"); 21 sb.Append("<div class=‘bgImage‘ style=‘background-image: url(‘ImagePath/"+item.Image+")‘);‘>"); 22 sb.Append("<span></span>"); 23 sb.Append("<div class=‘detail‘>"+item.VideoDetail+"</div>"); 24 sb.Append("<div class=‘textImage‘>"); 25 sb.Append("<h2>"+item.VideoName+"</h2>"); 26 sb.Append("</div>"); 27 sb.Append("</div>"); 28 sb.Append("</a>"); 29 sb.Append("</li>"); 30 } 31 ViewData["list"] = sb; 32 //判断是不是ajax请求 33 if (Request.IsAjaxRequest()) 34 { 35 return Content(sb.ToString()); 36 } 37 return View(); 38 }
获取分页类:
1 #region 获取分页数据和列数 2 public List<Video.Models.Video> GetVideo(int pageIndex, int pageSize, ref int totalCount,string a) 3 { 4 List<Video.Models.Video> list = null; 5 if (string.IsNullOrEmpty(a)) 6 { 7 list = (from p in db.Videos 8 orderby p.VideoId descending 9 select p).Skip((pageIndex - 1) * pageSize).Take(pageSize).ToList(); 10 } 11 else {//模糊搜索 12 list = (from p in db.Videos where p.VideoName.Contains(a) 13 orderby p.VideoId descending 14 select p).Skip((pageIndex - 1) * pageSize).Take(pageSize).ToList(); 15 } 16 17 totalCount = db.Videos.Count(); 18 //Linq表达式搜索的数据数量是全部数据的总数,当模糊搜索出的数据少于全部数据总数的时候就要处理下数据总数 19 if (list.Count<pageSize) 20 { 21 totalCount = list.Count; 22 } 23 return list; 24 } 25 #endregion
标签:
原文地址:http://www.cnblogs.com/fujinzhao/p/4634182.html