<link href="${base}/res/pra/css/style.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="${base}/res/basic/js/jquery/jqPaginator.min.js"></script>

<#--
表格标签：用于显示列表数据。
    value：列表数据，可以是Pagination也可以是List。
    class：table的class样式。默认"pn-ltable"。
    sytle：table的style样式。默认""。
    width：表格的宽度。默认100%。
-->
<#macro table value listAction="v_list.do" class="tablelist" style="" theadClass="" tbodyClass="" width="" selfPage="" pageId="pagination" pageNoName="pageNo" pageSizeName="pageSize" pageSizeValue="" gotoPageFunction="_gotoPage" checkFieldFunction="checkField">

<table class="${class}" <#if style?has_content>style="${style}"</#if> <#if width?has_content>width="${width}"</#if>>
<#if value?is_sequence><#local pageList=value/><#else><#local pageList=value.list/></#if>
<#list pageList as row>
<#if row_index==0>
<#assign i=-1/>
<thead <#if theadClass?has_content>class="${theadClass}"</#if>><tr><#nested row,i,true/></tr></thead>
</#if>
<#assign i=row_index has_next=row_has_next/>
<#if row_index==0><tbody  <#if tbodyClass?has_content>class="${tbodyClass}"</#if>><tr><#else><tr></#if><#nested row,row_index,row_has_next/>
<#if !row_has_next>
</tr></tbody>
<#else>
</tr>
</#if>
</#list>
</table>

<#if !value?is_sequence>
<div class="pagin" id="pagin">
    <div class="message">共<i class="blue">${value.totalCount}</i>条记录，当前显示第&nbsp;<i class="blue">${value.pageNo}/${value.totalPage}</i>&nbsp;页&nbsp;每页显示&nbsp;<input name="${pageSizeName!}" value="<#if pageSizeValue?? && pageSizeValue?has_content>${pageSizeValue!}<#else>${pageSize!20}</#if>" style="width:35px;" onchange="${checkFieldFunction}(this.value)">&nbsp;条</div>
    <ul class="paginList" id="${pageId}"></ul>
</div>

<script type="text/javascript">
$.jqPaginator('#${pageId}', {
    totalPages: ${value.totalPage},
    visiblePages: 10,
    currentPage: ${value.pageNo},
    activeClass: 'current',
    prev: '<li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>',
    next: '<li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>',
    page: '<li class="paginItem"><a href="javascript:;">{{page}}</a></li>',
    onPageChange: function (num, type) {
        if(type!='init')
               <#if selfPage?? &&  selfPage!="">${selfPage}(num)<#else>${gotoPageFunction}(num)</#if>;
    }
});
    
function ${gotoPageFunction}(pageNo) {
    try{
        var tableForm = getTableForm();
        $("input[name='${pageNoName}']").val(pageNo);
        tableForm.action="${listAction}";
        tableForm.onsubmit=null;
        tableForm.submit();
    } catch(e) {
        alert('_gotoPage('+pageNo+')方法出错');
    }
}

function ${checkFieldFunction}(val)
{
        var tableForm = getTableForm();
        $("input[name='${pageSizeName}']").val(val);
        tableForm.action="${listAction}";
        tableForm.onsubmit=null;
        tableForm.submit();
}

</script>
</#if>
<script type="text/javascript">
$('.tablelist tbody tr:odd').addClass('odd');
</script>
</#macro>

<form id="tableForm" method="post">
                 <@e.hidden name="pageNo" value="${pageNo!}"/>
                 <@e.hidden name="name" value="${name!}"/>
                 <@e.hidden name="lesson" value="${lesson!}"/>
                 <@e.hidden name="teacher" value="${teacher!}"/>
                 <@e.hidden name="type" value="${type!}"/>
                 <@e.table class="tablelist"  listAction="courseList.jspx" value=page;m,i,has_next>
                     <#if (i >= 0)>
                        <div class="course">
                            <div class="img">
                                <img src="${base}${(m.ctcdPicture)!}" alt="" />
                            </div>
                            <div class="contra">
                                <div class="w-position">
                                    <p class="left">${(m.ctcdName)!}</p>
                                    <p class="right">价格：￥${(m.price)!}</p>
                                </div>
                                <div class="dan-xian"></div>
                                <div class="text-frame">
                                    <div class="text">
                                        视频课程：<span class="blue">${(m.ctcdLesson)!}</span>课时
                                    </div>
                                    <div class="text">
                                        模拟试卷：<span class="blue">${(m.ctcdImitatePaper)!}</span>套
                                    </div>
                                    <div class="text">课程简介：${(m.ctcdSummary)!}</div>
                                </div>
                                <div class="btn">
                                    <a href="course_listen.html"><div class="bg st"></div>
                                    </a> <a href=""><div class="bg ckxq"></div>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </#if>
                </@e.table>
            </form>

后台代码：

public String courseList(HttpServletRequest request,Integer pageNo, Integer pageSize, ModelMap model) {
        CmCheckCycleDef cycleDef = scService.get().getCcdId();
        Pagination page = ctcdService.getPage(null, cycleDef.getCcdId(), "",
                "", cpn(pageNo), pageSize == null ? CookieUtils.getPageSize(request) : pageSize);
        model.addAttribute("page", page);
        System.out.println(page.getList().size());
        model.addAttribute("linkList", this.getFriendLink());
        model.addAttribute("pageNo", pageNo);
        model.addAttribute("pageSize", pageSize);
        return FrontUtils.getTplPathUrl(FrontUtils.SOLUTION, "",
                "course_list");
}