设为首页 加入收藏

TOP

Beego学习笔记6:分页的实现(一)
2017-12-07 14:22:13 】 浏览:43
Tags:Beego 学习 笔记 实现

实现分页的效果

1>     分页的实现的业务逻辑

1->每个页面显示N条数据,总的数据记录数M,则分页的个数为M%N==0?M/N:M/N+1;

2->页面渲染分页的html部分

3>切换页数,以及输入参数,后台处理,重新获取新的满足条件的数据

4>分页的方法,js分页,以及后台分页(下面的分页就是实现后台分页)

2>在models分页夹下,新建一个pager.go的模型,作为分页模型的结构使用。其代码如下:

 

package models 

import (
	"math"
	_ "github.com/go-sql-driver/mysql"
)
//分页方法,根据传递过来的页数,每页数,总数,返回分页的内容 7个页数 前 1,2,3,4,5 后 的格式返回,小于5页返回具体页数
func Paginator(page, prepage int, nums int64) map[string]interface{} {
	
		var firstpage int //前一页地址
		var lastpage int  //后一页地址
		//根据nums总数,和prepage每页数量 生成分页总数
		totalpages := int(math.Ceil(float64(nums) / float64(prepage))) //page总数
		if page > totalpages {
			page = totalpages
		}
		if page <= 0 {
			page = 1
		}
		var pages []int
		switch {
		case page >= totalpages-5 && totalpages > 5: //最后5页
			start := totalpages - 5 + 1
			firstpage = page - 1
			lastpage = int(math.Min(float64(totalpages), float64(page+1)))
			pages = make([]int, 5)
			for i, _ := range pages {
				pages[i] = start + i
			}
		case page >= 3 && totalpages > 5:
			start := page - 3 + 1
			pages = make([]int, 5)
			firstpage = page - 3
			for i, _ := range pages {
				pages[i] = start + i
			}
			firstpage = page - 1
			lastpage = page + 1
		default:
			pages = make([]int, int(math.Min(5, float64(totalpages))))
			for i, _ := range pages {
				pages[i] = i + 1
			}
			firstpage = int(math.Max(float64(1), float64(page-1)))
			lastpage = page + 1
			//fmt.Println(pages)
		}
		paginatorMap := make(map[string]interface{})
		paginatorMap["pages"] = pages
		paginatorMap["totalpages"] = totalpages
		paginatorMap["firstpage"] = firstpage
		paginatorMap["lastpage"] = lastpage
		paginatorMap["currpage"] = page
		return paginatorMap
}

  

3>     在views文件夹下,新建一个list.html页面作为显示分页的效果。其代码如下:

 

<!DOCTYPE html>
 
<html>
      <head>
        <title>首页 - 用户列表页面</title>
        <link rel="shortcut icon" href="/static/img/favicon.png" />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <style>
          .am-cf{
            height: 50px;          
            margin-top: 30px;
            line-height: 50px;
            text-align: center;
            vertical-align: middle;
            margin-left: 40%;
          }
          .am-fr{
              float: left;
              line-height: 50px;
              text-align: center;
              vertical-align: middle;
              height: 50px;
              margin-top: -15px;
          }
          .am-pagination{
            list-style:none;
            height: 50px;    
            line-height: 50px;
            text-align: center;
            vertical-align: middle;
          }
          .am-pagination li{
            float:left;
            margin-left: 10px;
          }
          .am-pagination li a{
            text-decoration:none;
          }
          .am-jl{
              float: left;
              margin-left: 20px;
          }
          .am-active{
              color: #f00;
          }
        </style>
      </head>
    
    <body>
     
        <div class="row pull-right" style="margin-bottom: 20px;margin-right: 5px;text-align:right;margin-right: 40px;">
          <a class="btn btn-succe
首页 上一页 1 2 3 下一页 尾页 1/3/3
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇Beego学习笔记四:编写Model 下一篇Beego 学习比较8:SQL语句

评论

帐  号: 密码: (新用户注册)
验 证 码:
表  情:
内  容:

最新文章

热门文章

C 语言

C++基础

windows编程基础

linux编程基础

C/C++面试题目