+ Start a Discussion
Naveen Kannoju02547126464965992Naveen Kannoju02547126464965992 

sort the record based on field name in data table

cloud you please give me help for this Question

I retrive the data from account(using custom controller) object and display that data in datatable(vf) format this one is good.
but  here column name for example: name,industry,type,rating.
here whenever i click the name or industry ior any other field name I want to display sort order depending on that field.

Thanks
Naveen
Best Answer chosen by Naveen Kannoju02547126464965992
SarfarajSarfaraj
Hi Naveen

Try these,
https://github.com/Mottie/tablesorter/wiki
http://mottie.github.io/tablesorter/docs/
https://github.com/Mottie/tablesorter

--Akram

All Answers

SarfarajSarfaraj
Use this,
VF:
<apex:page Controller="AccountListCtr">
<apex:includeScript value="//code.jquery.com/jquery-2.1.1.min.js"/>
<apex:includeScript value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.3/js/jquery.tablesorter.js"/>
<apex:includeScript value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.3/js/jquery.tablesorter.widgets.js"/>
<apex:stylesheet value="//cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.18.3/css/theme.jui.css"/>
<script>
    $(document).ready(function(){
        $("table").tablesorter({

        theme : 'jui', 

        headerTemplate : '{content} {icon}',

        widgets : ['uitheme', 'zebra'],

        widgetOptions : {
          zebra   : ["even", "odd"],
        }

  });
    });
</script>
<apex:form >
<apex:pageBlock >
    <apex:pageBlockTable value="{!accounts}" var="account">
        <apex:column value="{!account.Name}"/>
        <apex:column value="{!account.Industry}"/>
        <apex:column value="{!account.Type}"/>
        <apex:column value="{!account.Rating}"/>
    </apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page>

Controller:
public with sharing class AccountListCtr {

    public List<Account> getAccounts()
    {
        return [Select Id, Name, industry, type, rating From Account];
    }

}

--Akram
Naveen Kannoju02547126464965992Naveen Kannoju02547126464965992
Hi....
Akram

Thank you very very much for given this reply.
which is very useful to me

Thanks
Naveen
 
Naveen Kannoju02547126464965992Naveen Kannoju02547126464965992
HI..Akram

How to highlight that column name ,here problem is data and column both are same type .that's why i want change header will appear another
way.
total means header will displayed in button type or drop down type .

please give me solution for this.

Thanks,
Naveen 
SarfarajSarfaraj
Hi Naveen

Try these,
https://github.com/Mottie/tablesorter/wiki
http://mottie.github.io/tablesorter/docs/
https://github.com/Mottie/tablesorter

--Akram
This was selected as the best answer
Naveen Kannoju02547126464965992Naveen Kannoju02547126464965992
HI....akram

Thank you for giving this solution.

Thanks,
Naveen.
 
Sébastien RichardSébastien Richard
Hi,

You will also find an elegant solution without javascript proposed by Trailhead Salesforce.
Here is the link : https://developer.salesforce.com/trailhead/force_com_dev_beginner/visualforce_fundamentals/visualforce_custom_controllers
Johny SinsJohny Sins
Very helpful discussion. Thanks for everyone. I am Johny Sins from Plumbers In Montana (https://www.reverbnation.com/artist/johnysins34) services. 
Manoj singh 56Manoj singh 56
Very helpfull followd the same thanks for the details...
For details tech information plz visit Ultimate Technical Gyan (http://Gethow.in)
Amrita Singh 26Amrita Singh 26
Hi you are very good Does tech for queue a future method count as DML... direct admission in mbbs (https://careermudhra.com)
Source : https://careermudhra.com