salesforce 零基础学习(四十九)自定义列表分页之使用Pagination实现分页效果 ※※※
2016-11-04 14:05
756 查看
上篇内容为Pagination基类的封装,此篇接上篇内容描述如何调用Pagination基类。
首先先创建一个sObject,起名Company info,此object字段信息如下:
CompanyListPage
其中,CompanyListPage中没有对页面进行样式调整,也没有做相关search,new,edit以及view的操作,感兴趣的小伙伴可以自行补充。
显示效果:
1.语言为英文(我的默认语言)情况下:
2.语言为中文情况下:
3.翻页效果:
4.尾页效果:
总结:此篇结合上篇实现了如果不用标准界面的分页自己创建分页的实例展示,其中有考虑不细致的地方,比如offset超过2000应该有一定提示等,也有没有做完的地方,比如模糊搜索和增删改功能。如果篇中有错误地方欢迎指正,如果有不懂的地方欢迎留言。(ps:效果显示请忽略UI)
首先先创建一个sObject,起名Company info,此object字段信息如下:
1 <apex:page controller="CompanyController"> 2 <apex:form > 3 <apex:outputPanel layout="block"> 4 <apex:outputPanel layout="block"> 5 <apex:outputPanel layout="block"> 6 <apex:outputPanel layout="block" id="companyList"> 7 <apex:dataTable align="center" value="{!resultList}" var="companyInfo"> 8 <apex:column style="width:180px;"> 9 <apex:facet name="header">{!$ObjectType.Company_Info__c.fields.Company_Code_Unique__c.label}</apex:facet> 10 <apex:outputText value="{!companyInfo.Company_Code_Unique__c}" /> 11 </apex:column> 12 <apex:column style="width:180px;"> 13 <apex:facet name="header">{!$ObjectType.Company_Info__c.fields.Company_Name__c.label}</apex:facet> 14 <apex:outputText value="{!companyInfo.Company_Name__c}" /> 15 </apex:column> 16 <apex:column style="width:225px;"> 17 <apex:facet name="header">{!$ObjectType.Company_Info__c.fields.Company_Place__c.label}</apex:facet> 18 <apex:outputText value="{!companyInfo.Company_Place__c}" /> 19 </apex:column> 20 <apex:column style="width:225px;"> 21 <apex:facet name="header">{!$ObjectType.Company_Info__c.fields.Company_Type__c.label}</apex:facet> 22 <apex:outputText value="{!companyInfo.Company_Type__c}" /> 23 </apex:column> 24 <apex:column style="width:225px;"> 25 <apex:facet name="header">{!$ObjectType.Company_Info__c.fields.Employees_Number__c.label}</apex:facet> 26 <apex:outputText value="{!companyInfo.Employees_Number__c}" /> 27 </apex:column> 28 <apex:column style="width:500px;"> 29 <apex:facet name="header">操作</apex:facet> 30 31 </apex:column> 32 </apex:dataTable> 33 34 <apex:outputPanel layout="block" styleClass="paginator" 35 style="padding:0px;"> 36 <apex:panelGrid columns="2" style="width:100%;" 37 styleClass="az_text_table" rowClasses="paginator,paginator"> 38 <apex:outputText rendered="{!!resultPagination.hasRecord}" 39 value="第 0 页,共 0 页,每页 {!resultPagination.pageSize} 条" /> 40 <apex:outputText rendered="{!resultPagination.hasRecord}" 41 value="第 {!resultPagination.pageNumber} 页,共 {!resultPagination.totalPage} 页,每页 {!resultPagination.pageSize} 条" /> 42 <apex:panelGroup > 43 <apex:outputPanel > 44 <apex:outputText value="首页" 45 rendered="{!(!resultPagination.hasRecord)||(!resultPagination.hasPrevious)}" 46 style="border: solid 1px #ddd;padding:1px 6px;background: #e8e8e9;margin-right:5px;"></apex:outputText> 47 <apex:commandLink action="{!firstPage}" 48 rendered="{!resultPagination.hasRecord && resultPagination.hasPrevious}" 49 immediate="true" reRender="companyList" value="首页" 50 style="margin-right:5px;" /> 51 </apex:outputPanel> 52 <apex:outputPanel > 53 <apex:outputText value="上一页" 54 rendered="{!!resultPagination.hasRecord || (!resultPagination.hasPrevious)}" 55 style="border: solid 1px #ddd;padding:1px 6px;background: #e8e8e9;margin-right:5px;"></apex:outputText> 56 <apex:commandLink action="{!previousPage}" 57 rendered="{!resultPagination.hasRecord && resultPagination.hasPrevious}" 58 immediate="true" reRender="companyList" value="上一页" 59 style="margin-right:5px;" /> 60 </apex:outputPanel> 61 <apex:outputPanel > 62 <apex:outputText value="{!resultPagination.pageNumber}" 63 styleClass="current" /> 64 </apex:outputPanel> 65 <apex:outputPanel > 66 <apex:outputText value="下一页" 67 rendered="{!!resultPagination.hasRecord || !resultPagination.hasNext}" 68 style="border: solid 1px #ddd;padding:1px 6px;background: #e8e8e9;margin-right:5px;margin-left:5px;"></apex:outputText> 69 <apex:commandLink action="{!nextPage}" 70 rendered="{!resultPagination.hasRecord && resultPagination.hasNext}" 71 immediate="true" reRender="companyList" value="下一页" 72 style="margin-right:5px;margin-left:5px;" /> 73 </apex:outputPanel> 74 <apex:outputPanel > 75 <apex:outputText value="尾页" 76 rendered="{!!resultPagination.hasRecord || !resultPagination.hasNext}" 77 style="border: solid 1px #ddd;padding:1px 6px;background: #e8e8e9;margin-right:5px;"></apex:outputText> 78 <apex:commandLink action="{!lastPage}" 79 rendered="{!resultPagination.hasRecord && resultPagination.hasNext}" 80 immediate="true" reRender="companyList" value="尾页" 81 style="margin-right:5px;" /> 82 </apex:outputPanel> 83 </apex:panelGroup> 84 </apex:panelGrid> 85 </apex:outputPanel> 86 </apex:outputPanel> 87 </apex:outputPanel> 88 </apex:outputPanel> 89 </apex:outputPanel> 90 </apex:form> 91 </apex:page>
CompanyListPage
其中,CompanyListPage中没有对页面进行样式调整,也没有做相关search,new,edit以及view的操作,感兴趣的小伙伴可以自行补充。
显示效果:
1.语言为英文(我的默认语言)情况下:
2.语言为中文情况下:
3.翻页效果:
4.尾页效果:
总结:此篇结合上篇实现了如果不用标准界面的分页自己创建分页的实例展示,其中有考虑不细致的地方,比如offset超过2000应该有一定提示等,也有没有做完的地方,比如模糊搜索和增删改功能。如果篇中有错误地方欢迎指正,如果有不懂的地方欢迎留言。(ps:效果显示请忽略UI)
相关文章推荐
- salesforce 零基础学习(四十八)自定义列表分页之Pagination基类封装 ※※※
- salesforce 零基础学习(二十六)自定义图表chart简单介绍(使用apex和VF实现)
- salesforce 零基础学习(六十三)Comparable实现Object列表数据的自定义排序
- salesforce零基础学习(八十三)analytics:reportChart实现Dashboard(仪表盘)功能效果
- salesforce使用Apex控制器和VF实现自定义服务器端分页项目实战(自定义分页)
- salesforce 零基础学习(二十八)使用ajax方式实现联动
- salesforce 零基础学习(四十四)实现checkbox列表简单过滤功能
- salesforce中使用标准和自定义组件多种方式实现helpText(tip tool)效果 - 合集/配图
- salesforce 零基础学习(七十)使用jquery tree实现树形结构模式
- salesforce零基础学习(八十)使用autoComplete 输入内容自动联想结果以及去重实现
- salesforce 零基础学习(六十一)apex:component简单使用以及图片轮转播放的实现
- 使用Jquery分页插件jquery.pagination.js 实现无刷新分页效果
- salesforce 零基础学习(五十一)使用 Salesforce.com SOAP API 实现用户登录以及简单的增删改查(JAVA访问salesforce)
- 采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果
- Android提高篇之自定义dialog实现processDialog“正在加载”效果、使用Animation实现图片旋转
- Android中Spinner下拉列表(使用ArrayAdapter和自定义Adapter实现)
- Extjs学习总结之12使用ComboBox实现分页
- JXCELL实例学习与研究(六) 之 sheet的分页功能的实现,以及基本EXCEL公式的使用 以及补充函数说明
- C#基础之温习--使用列表和链表实现优一个先级队列
- Flex4之自定义动画效果,使用自定义Parallel类来实现