You need to sign in to do that
Don't have an account?
Sudhir_Meru
Sort Columns in Visualforce Page
Hi,
I have a requirement to sort visual force page. Please suggest me how to sort columns. Please see my code and suggest me
I have a requirement to sort visual force page. Please suggest me how to sort columns. Please see my code and suggest me
<apex:page controller="CCW_ContactPaginationController" showHeader="true" sidebar="true" > <script type="text/javascript"> /* * function to handle checkbox selection */ function doCheckboxChange(cb,itemId){ if(cb.checked==true){ aSelectItem(itemId); } else{ aDeselectItem(itemId); } } function doCheckboxChange2(cb,itemId){ if(cb.checked==true){ aSelectItem2(itemId); } else{ aDeselectItem2(itemId); } } </script> <!-- Using apex:pageMessages instead <script type="text/javascript"> function Validation() { var val = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.confignewopp.newopp}').value; var oval = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.configopport.existopp}').value; var edate = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.configexpiredate.expredate}').value; var eterm = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.configexpire.expterms}').value; var eresr = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.configreseller.resler}').value; var edstb = document.getElementById('{!$Component.RenewalForm.configblock.configsecblock.configdistrbutor.distbtr}').value; if ( edate == '' && eterm == '0' ) { alert('Enter either expire date or select expite term'); return false; } else if ( edate != '' && eterm != '0' ) { alert('Enter either expire date or select expite term'); return false; } else if ( eresr == '' && edstb == '' ) { alert('Enter reseller and distributor details'); return false; } else if ( eresr == '' && edstb != '' ) { alert('Enter reseller details'); return false; } else if ( eresr != '' && edstb == '' ) { alert('Enter distributor details'); return false; } else if ( val == '' && oval == '') { alert('Enter either existing opportunity or new opporutnity'); return false; } else if ( val != '' && oval != '') { alert('Enter either existing opportunity or new opporutnity'); return false; } else alert('Please check row in Install Based Report to saved records'); return true; } </script> Done commenting the javaScript code --> <apex:sectionHeader subtitle="Create Renewal Quote" title="Meru Networks"/> <apex:form id="RenewalForm"> <apex:pageBlock id="filterblock"> <apex:pageBlockSection title="Filters" columns="3" id="filterblocksection"> <apex:inputField value="{!GetAccount.AccountId}" label="Account"/> <apex:inputField value="{!GetContract.Name}" label="Contract" required="false"/> <apex:commandButton action="{!fetch_data}" value="Fetch Data"></apex:commandbutton> </apex:pageBlockSection> </apex:pageBlock> <apex:pageBlock id="reportblock"> <apex:pageMessages /> <apex:pageBlockButtons id="reportbutton"> <apex:commandButton value="Save Records" action="{!processSelected}" /> <apex:commandButton value="Cancel" onclick="window.top.close()"/> </apex:pageBlockButtons> <!-- handle selected item --> <apex:actionFunction name="aSelectItem" action="{!doSelectItem}" rerender="mpb"> <apex:param name="contextItem" value="" assignTo="{!contextItem}"/> </apex:actionFunction> <apex:actionFunction name="aSelectItem2" action="{!doSelectItem2}" rerender="mpb"> <apex:param name="contextItem2" value="" assignTo="{!contextItem2}" /> </apex:actionFunction> <!-- handle deselected item --> <apex:actionFunction name="aDeselectItem" action="{!doDeselectItem}" rerender="mpb"> <apex:param name="contextItem" value="" assignTo="{!contextItem}"/> </apex:actionFunction> <apex:actionFunction name="aDeselectItem2" action="{!doDeselectItem2}" rerender="mpb"> <apex:param name="contextItem2" value="" assignTo="{!contextItem2}"/> </apex:actionFunction> <apex:pageBlockSection title="Install Base" id="mpb" collapsible="true" columns="1" > <!-- table of data --> <apex:pageBlockTable title="Assets" value="{!Contacts}" var="c" id="reportblocktable" > <apex:column > <apex:facet name="header">Action</apex:facet> <apex:inputCheckbox value="{!c.IsSelected}" onclick="doCheckboxChange(this,'{!c.tContact.Id}')"/> </apex:column> <apex:column > <apex:facet name="header">Bundle Support</apex:facet> <apex:inputCheckbox value="{!c.BundelSelected}" onclick="doCheckboxChange2(this,'{!c.tContact.Id}')"/> </apex:column> <apex:column value="{!c.tContact.AccountId}"/> <apex:column value="{!c.tContact.Product2Id}"/> <apex:column value="{!c.tContact.SerialNumber}"/> <apex:column value="{!c.tContact.last_contract_number__c}"/> <apex:column value="{!c.tContact.Service_Start_Date_Min__c}"/> <apex:column value="{!c.tContact.Service_End_Date_Max__c}"/> <apex:column value="{!c.tContact.InstallDate}"/> <apex:inlineEditSupport event="ondblClick" showOnEdit="saveButton,cancelButton" hideOnEdit="editButton" /> </apex:pageBlockTable> <apex:pageBlockSection collapsible="false" columns="2" id="paginsecblock"> <!-- count of selected items --> <apex:outputLabel value="[{!selectedCount} records selected]" /> <!-- next, previous and page info --> <apex:outputPanel style="float:right"> <apex:commandLink action="{!doPrevious}" rendered="{!hasPrevious}" value="Previous" /> <apex:outputLabel rendered="{!NOT(hasPrevious)}" value="Previous"/> <apex:outputLabel value=" (page {!pageNumber} of {!totalPages}) "/> <apex:commandLink action="{!doNext}" rendered="{!hasNext}" value="Next" /> <apex:outputLabel rendered="{!NOT(hasNext)}" value="Next"/> </apex:outputPanel> </apex:pageBlockSection> </apex:pageBlockSection> </apex:pageBlock> <apex:pageBlock id="configblock"> <apex:pageBlockSection title="Configuration Option" columns="2" id="configsecblock"> <apex:pageBlockSectionItem id="configexpire"> <apex:outputLabel value="Expiry Term:" for="expireterm"/> <apex:selectList value="{!ExpireTerms}" multiselect="false" size="1" id="expterms"> <apex:selectOption itemValue="0" itemLabel="--none--" id="exptermsnon"/> <apex:selectOption itemValue="1" itemLabel="1 Year"/> <apex:selectOption itemValue="3" itemLabel="3 Year"/> <apex:selectOption itemValue="5" itemLabel="5 Year"/> </apex:selectList> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configexpiredate"> <apex:outputLabel value="Expiry Date:"/> <apex:inputField value="{!GetExpireDate.Expire_Date__c}" id="expredate"/> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configincumbent"> <apex:outputLabel value="Incumbent Reseller"></apex:outputLabel> <!--apex:inputCheckbox value="{!IncumbentReseller}"/--> <apex:selectList value="{!IncumbentReseller}" multiselect="false" size="1" id="incumbentReseller"> <apex:selectOption itemValue="No" itemLabel="No" /> <apex:selectOption itemValue="Yes" itemLabel="Yes" /> </apex:selectList> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configeducation"> <apex:outputLabel value="Education"></apex:outputLabel> <!--apex:inputCheckbox value="{!Education}"/--> <apex:selectList value="{!Education}" multiselect="false" size="1" id="Education"> <apex:selectOption itemValue="None" itemLabel="None" /> <apex:selectOption itemValue="K-12" itemLabel="K-12" /> <apex:selectOption itemValue="Higher-Ed" itemLabel="Higher-Ed" /> </apex:selectList> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configreseller"> <apex:outputLabel value="Reseller"></apex:outputLabel> <apex:inputField value="{!GetReseller.Primary_Reseller__c}" id="resler" /> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configdistrbutor"> <apex:outputLabel value="Distributor"></apex:outputLabel> <apex:inputField value="{!GetDistributor.Primary_Distributor__c}" id="distbtr"/> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="configopport"> <apex:outputLabel value="Opportunity"></apex:outputLabel> <apex:inputField value="{!GetOpportunity.Opportunity__c}" id="existopp"/> </apex:pageBlockSectionItem> <apex:pageBlockSectionItem id="confignewopp"> <apex:outputLabel value="New Opportunity"></apex:outputLabel> <apex:inputField value="{!GetNewOpportunity.New_Opportunity__c}" id="newopp"/> </apex:pageBlockSectionItem> <apex:pageblockSectionItem id="configMonthlyQuote"> <apex:outputLabel value="Generate Monthly SKU's"></apex:outputLabel> <apex:inputCheckbox value="{!monthly_quote}" id="monthlyQuote"/> </apex:pageblockSectionItem> </apex:pageBlockSection> </apex:pageBlock> </apex:form> </apex:page>
There are 2 different cases:
1. Sorting on server side (in controller)
2. Sorting on client side (on VF page)
In first case you can use SOQL ORDER BY for sorting by any field.
In second case you can use JavaScript/jQuery for sorting, e.g. https://datatables.net/ or something else.
I am using wrapper class and pagination in my code. Please check the controller code below Please suggest me what is best here
Thanks
Sudhir