freemaker自定义分页控件实现

<link href="${res}/css/pages-jhdb.css"  rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${res}/js/laypage/laypage.js" ></script>
#pages-jhdb{padding-left:5px;}
/*! layPage-v1.3.0 分页组件 License MIT  http://laypage.layui.com/ By 贤心 */
;!function(){"use strict";function a(d){var e="laypagecss";a.dir="dir"in a?a.dir:f.getpath+"/skin/laypage.css",new f(d),a.dir&&!b[c](e)&&f.use(a.dir,e)}a.v="1.3";var b=document,c="getElementById",d="getElementsByTagName",e=0,f=function(a){var b=this,c=b.config=a||{};c.item=e++,b.render(!0)};f.on=function(a,b,c){return a.attachEvent?a.attachEvent("on"+b,function(){c.call(a,window.even)}):a.addEventListener(b,c,!1),f},f.getpath=function(){var a=document.scripts,b=a[a.length-1].src;return b.substring(0,b.lastIndexOf("/")+1)}(),f.use=function(c,e){var f=b.createElement("link");f.type="text/css",f.rel="stylesheet",f.href=a.dir,e&&(f.id=e),b[d]("head")[0].appendChild(f),f=null},f.prototype.type=function(){var a=this.config;return"object"==typeof a.cont?void 0===a.cont.length?2:3:void 0},f.prototype.view=function(){var b=this,c=b.config,d=[],e={};if(c.pages=0|c.pages,c.curr=0|c.curr||1,c.groups="groups"in c?0|c.groups:5,c.first="first"in c?c.first:"首页",c.last="last"in c?c.last:"尾页",c.prev="prev"in c?c.prev:"上一页",c.next="next"in c?c.next:"下一页",c.pages<=1)return"";for(c.groups>c.pages&&(c.groups=c.pages),e.index=Math.ceil((c.curr+(c.groups>1&&c.groups!==c.pages?1:0))/(0===c.groups?1:c.groups)),c.curr>1&&c.prev&&d.push(‘<a href="javascript:;" class="laypage_prev" data-page="‘+(c.curr-1)+‘">‘+c.prev+"</a>"),e.index>1&&c.first&&0!==c.groups&&d.push(‘<a href="javascript:;" class="laypage_first" data-page="1"  title="首页">‘+c.first+"</a><span>…</span>"),e.poor=Math.floor((c.groups-1)/2),e.start=e.index>1?c.curr-e.poor:1,e.end=e.index>1?function(){var a=c.curr+(c.groups-e.poor-1);return a>c.pages?c.pages:a}():c.groups,e.end-e.start<c.groups-1&&(e.start=e.end-c.groups+1);e.start<=e.end;e.start++)e.start===c.curr?d.push(‘<span class="laypage_curr" ‘+(/^#/.test(c.skin)?‘style="background-color:‘+c.skin+‘"‘:"")+">"+e.start+"</span>"):d.push(‘<a href="javascript:;" data-page="‘+e.start+‘">‘+e.start+"</a>");return c.pages>c.groups&&e.end<c.pages&&c.last&&0!==c.groups&&d.push(‘<span>…</span><a href="javascript:;" class="laypage_last" title="尾页"  data-page="‘+c.pages+‘">‘+c.last+"</a>"),e.flow=!c.prev&&0===c.groups,(c.curr!==c.pages&&c.next||e.flow)&&d.push(function(){return e.flow&&c.curr===c.pages?‘<span class="page_nomore" title="已没有更多">‘+c.next+"</span>":‘<a href="javascript:;" class="laypage_next" data-page="‘+(c.curr+1)+‘">‘+c.next+"</a>"}()),‘<div name="laypage‘+a.v+‘" class="laypage_main laypageskin_‘+(c.skin?function(a){return/^#/.test(a)?"molv":a}(c.skin):"default")+‘" id="laypage_‘+b.config.item+‘">‘+d.join("")+function(){return c.skip?‘<span class="laypage_total"><label>到第</label><input type="number" min="1" onkeyup="this.value=this.value.replace(/\\D/, \‘\‘);" class="laypage_skip"><label>页</label><button type="button" class="laypage_btn">确定</button></span>‘:""}()+"</div>"},f.prototype.jump=function(a){if(a){for(var b=this,c=b.config,e=a.children,g=a[d]("button")[0],h=a[d]("input")[0],i=0,j=e.length;j>i;i++)"a"===e[i].nodeName.toLowerCase()&&f.on(e[i],"click",function(){var a=0|this.getAttribute("data-page");c.curr=a,b.render()});g&&f.on(g,"click",function(){var a=0|h.value.replace(/\s|\D/g,"");a&&a<=c.pages&&(c.curr=a,b.render())})}},f.prototype.render=function(a){var d=this,e=d.config,f=d.type(),g=d.view();2===f?e.cont.innerHTML=g:3===f?e.cont.html(g):b[c](e.cont).innerHTML=g,e.jump&&e.jump(e,a),d.jump(b[c]("laypage_"+e.item)),e.hash&&!a&&(location.hash="!"+e.hash+"="+e.curr)},"function"==typeof define?define(function(){return a}):"undefined"!=typeof exports?module.exports=a:window.laypage=a}();
<form id="ctl01" action="${base}/member/wenzhang.jhtml" method="post">
                    <input type="hidden" name="pageNo" value="${(pageNo)!}" />
                    <div class="pages">
                        <ul>
                        <#if articlePage?? && articlePage.list??>
                        <#list articlePage.list as article>
                            <li>
                                <input class="fl mr15 put" name="id" type="checkbox" value="${(article.id)!}" style="margin-top: 17px;"/>
                                <a href="#"style="width:320px;float:left;color:#666;text-align:left;">${(article.title)!}</a>
                                <span class="wd140" style="color:#666">&nbsp;</span>
                                <span class="wd140" style="color:#666">${(article.time)!}</span>
                                <div style="width:140px;float:left;" >
                                    <a href="${base}/member/v_edit_fbwz.jhtml?id=${(article.id)!}" style="color:#666">编辑</a>
                                    <a href="" onclick="delOne(${(article.id)!})" style="color:#666">删除</a>
                                </div>
                            </li>
                        </#list>
                        </#if>
                        </ul>
                        <div class="Select-all mt2 clearfix fl">
                            <input value="" class="check-box mr15 mt15 vm fl" id="chkall" type="checkbox" onclick="sel()" />
                                <span class="dib graydeep vm fl" style="margin-top:2px;">全选</span>
                            <button type="submit" class="dib ml5 vm pl15 nowrap button-ff cp fl tijiao" onclick="del()">
                                <span class="dib pr15 btn-del cp">删除所选</span></button>
                        </div>
                        <div style="clear:both;"></div>
                    </div>
                    <div id="pages-jhdb"></div>
                    <@p.page pageDivID="pages-jhdb" pageInfo=articlePage formId="ctl01" pageNoName="pageNo" />
</form>
时间: 2024-11-08 23:39:51

freemaker自定义分页控件实现的相关文章

Mvc自定义分页控件

MVC开发分页常常使用第三方控件,生成的分页HTML带有版权申明,虽然免费,但是总有的别扭.于是,某日,楼主闲来蛋疼,折腾了个自定义分页控件: 先来展示下效果图: 1>当分页不超过10页的时候,完全显示出来: 2>当分页超过10页,效果图如下所示: 再来看看生成的分页代码,竟然和楼主一样纯洁!!! 3>支持自定义路由.参数.页码html格式.首末页是否显示.上下页是否显示.URL分页参数传递功能. 使用方法: 1.引用 YYP.PagerHtml.dll 2.页面使用 @using YY

WPF管理系统自定义分页控件 - WPF特工队内部资料

原文:WPF管理系统自定义分页控件 - WPF特工队内部资料 最近做一个演示的管理系统项目,需要用到分页控件,在网上找了很多,依然找到与UI模版匹配的,最后干脆自己写一个. 分页控件分析: 1.分页控件分简单显示和复杂显示两种: 2.包含上一页.下一页以及页码明细逻辑处理: 3.页码总数小于7时显示默认显示,大于7时切换复杂显示: 4.页码数.索引.总条数计算等: 先来一张效果图: 啥也不说了直接上代码 MISPager.xaml部分 <ResourceDictionary xmlns="

winform 自定义分页控件 及DataGridview数据绑定

分页效果如上图所示,用到的控件均为基本控件 ,其方法如下 右击项目-添加-新建项 选择用户控件 然后在用户控件中拖入所需要的Label,Button,Text 用户控件全部代码: using System; using System.Collections.Generic; using System.ComponentModel; using System.Drawing; using System.Data; using System.Linq; using System.Text; usin

Winform自定义分页控件的实现

实现效果 有点丑陋 但是功能是没问题的 测试过 实现思路 先创建一个用户控件 代码实现 public partial class PagerControl : UserControl { private int record = 0; /// <summary> /// 总记录数 /// </summary> public int Record { get { return record; } set { record = value; InitPageInfo(); } } pr

winform自定义分页控件

1.控件代码: public partial class PagerControl : UserControl { #region 构造函数 public PagerControl() { InitializeComponent(); } #endregion #region 分页字段和属性 private int pageIndex = 1; /// <summary> /// 当前页面 /// </summary> public virtual int PageIndex {

自定义分页控件PageList

1 using System; 2 namespace Commons.PageList 3 { 4 interface IPageList 5 { 6 int PageIndex { get; } 7 int PageSize { get; } 8 int TotalCount { get; } 9 int TotalPage { get; } 10 } 11 } 1 using System.Collections; 2 using System.Collections.Generic; 3

easyui-datagrid自定义分页控件样式

var p = $('#tbTaskList').datagrid('getPager'); $(p).pagination({ pageSize: 20,//每页显示的记录条数,默认为10 pageList: [20, 50, 100],//可以设置每页记录条数的列表 beforePageText: '第',//页数文本框前显示的汉字 afterPageText: '页 共 {pages} 页', displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记

[转]Oracle分页之二:自定义web分页控件的封装

本文转自:http://www.cnblogs.com/scy251147/archive/2011/04/16/2018326.html 上节中,讲述的就是Oracle存储过程分页的使用方式,但是如果大量的页面要使用这个分页存储过程,如果利用上节的方式,势必要书写大量的代码.如何才能够少些代码书写量呢?当然了,利用自定义web控件进行一下封装,也许是一个好方法,但是如何进行封装呢? 首先,就是在项目中添加一个“Web 用户控件“的页面,我们定义为:MyPagination.ascx 然后,就是

【Z13QU】【1】自定义WindowsForm分页控件使用【共两篇】

注释: 欢迎加Z13QU的源码分享群:276435339 没有闲杂的交流,只有实实在在的分享.不懂的技术问题,直接通过QQ群问问来解决. 效果图: 需要的文件: 1. Z13QU.dll  [已经放置到QQ群文件中] 步骤: 1.WindowsForm程序中,引用Z13QU.dll 2.在工具箱中,添加一个新选项卡,然后右键-->选择项-->浏览,选择Z13QU.dll,然后确定 完成后效果[page是.net原生态的控件.pageX是需要安装dotnetbar] 拖动后效果如下: 3.这只是