Question

新编辑：此问题现已解决。有一个拼写错误的tablesorterPager（不能拼写为tableSorterPager！）。

我已经让pageorter工作了，但是经过数小时的研究和几种方法后，我无法让pagesorter.pager工作。分拣工作正常。但是，如果我添加TableSorterPager脚本，分页不起作用（始终显示所有行），并且在页面的该部分的重新呈现时，列不再格式化（折叠到一个接一个）并且排序功能是不见了。我错过了一个文件，或者哪个细节错了？感谢。

代码的关键元素是：

头脑中的

：

    > <apex:includeScript 
    > value="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" /> 
    > <apex:includeScript 
    > value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/js/jquery.tablesorter.min.js"
    > /> <apex:includeScript 
    > value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/js/parsers/parser-input-select.js"
    > />    <apex:includeScript 
    >      value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/jquery.tablesorter.pager.min.js"
    > />
<apex:includeScript
        value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/jquery.tablesorter.pager.css" />

     <apex:stylesheet 
    > value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/css/theme.blue.css"
    > />

包含该表的页面块（块被重新呈现）：

<apex:pageBlock id="block" >

        <script type="text/javascript">
            $j = jQuery.noConflict();  
            $j(document).ready(function()
            {
                $j("[id$='attendees']").tablesorter({
                    widthFixed: true,
                    widgets: ['zebra'],
                    theme: 'blue', 
                    headers: {
                        2: { sorter: 'select' }},
                    sortList: [[0,0],[1,0]]
                })
               .tableSorterPager({container: $j("#pager")});
            });
        </script>

块中的其他内容，然后是dataTable：

<apex:dataTable value="{!displayedAttendances}" var="att" styleClass="tablesorter" id="attendees" >
                     <apex:column headerValue="Last Name">
                        <apex:outputField value="{!att.attendance.last_name__c}" />
                    </apex:column>
                    <apex:column headerValue="First Name">
                        <apex:outputField value="{!att.attendance.first_name__c}" />
                    </apex:column>
                    <apex:column headerValue="Status">
                        <apex:inputField value="{!att.attendance.status__c}" >
                            <apex:actionSupport event="onchange" action="{!att.changeStatus}" 
                                rerender="errs1, errs2, newSes, block" />
                        </apex:inputField>
                    </apex:column>
            </apex:dataTable>

寻呼机div：

<!-- Start controls for tablesorter Pager plugin -->
        <div id="pager" class="pager">
        <form>
         <img src="http://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/icons/first.png" class="first"/> 
         <img src="http://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/icons/prev.png" class="prev"/> 
         <input type="text" class="pagedisplay"/>
         <img src="http://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/icons/next.png" class="next"/> 
         <img src="http://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.4/addons/pager/icons/last.png" class="last"/> 
         Display
         <select class="pagesize">
            <option selected="selected"  value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
         </select>
         records per page
         </form>
        </div>
        <!-- end controls for tablesorter Pager plugin -->

如何在salesforce中为数据表实现jquery tablesorter.pager？

0 个答案: