Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Chad RitchieChad Ritchie 

Sorting DataTable in Visualforce

Hey everyone, 

I have a pretty simple dataTable in Visualforce (see code below), I'm just trying to figure out how to sort by {!b.Balance__c}

I've tried a number of things, but none of them seem to work. 

Thanks!!!

  <apex:pageBlock >
         <apex:dataTable value="{!Contact.Positions__r}" var="b" width="100%" columns="1" columnsWidth="60%,40%">
         sortorder = "{!b.Name}"
             <apex:column > 
                 <apex:outputText value="{!b.Product__r.Name}"/> 
             </apex:column>
             <apex:column > 
                 <apex:outputText value="{!b.Name}"/> 
             </apex:column>
         <apex:column style="text-align:right" headerClass="CurrencyElement"> 
                 <apex:outputField value="{!b.Balance__c}"/> 
             </apex:column>
         </apex:dataTable>
     </apex:pageBlock>
Best Answer chosen by Chad Ritchie
David Zhu 🔥David Zhu 🔥
You may use the following code snippet as reference. It is pretty easy and straigh forward.

1. For each apex:column, change the code as below. 
<apex:column value="{!b.Name}">
    <apex:facet name="header">
            <apex:commandLink action="{!queryData}" value="Name{!sortExpression=='Name',IF(sortDirection='ASC','▼','▲'),'')}" id="sortName" reRender="contactPanel" status="spinner">
                <apex:param value="Name" name="column" assignTo="{!sortExpression}" ></apex:param>
            </apex:commandLink>
    </apex:facet>
</apex:column>
2. Add the following code 
private String sortExp = 'name';
    public String sortExpression
    {
        get
        {
            return sortExp;
        }
        set
        {
            //if the column is clicked on then switch between Ascending and Descending modes
            if (value == sortExp)
            {
                sortDirection = (sortDirection == 'ASC')? 'DESC' : 'ASC';
            }
            else
            {
                sortDirection = 'ASC';
            }
            sortExp = value;
        }
    }

    public String sortDirection
    {
        get
        {
            //if no column is selected
            if (sortExpression == null || sortExpression == '')
                return 'ASC';
            else
                return sortDirection;
        }
        Set
        {
            sortDirection = value;
        }
    }

3. Build you query function. You need to change accordinlgy. 
public void queryData()
{

    String queryString = 'SELECT Id,name,xxx,xxxx FROM Contact';   //select all fields

    switch on  sortExpression
    {
        when 'productName'
        {
            queryString += ' ORDER BY Product__r.Name ' + sortDirection;
        }
        when 'Name'
        {
            queryString += ' ORDER BY Name ' + sortDirection;
        }
        when else
        {
            ......
        }
    }

    if (sortDirection == 'ASC')
    {
        queryString += ' NULLS First';
    }
    else
    {
        queryString += ' NULLS LAST';
    }

    queryString += ' LIMIT 9500';

    List<yourobject> DataList = Database.query(queryString); //pass the result to the object to be displayed on VF page

}










 

All Answers

Agustin BAgustin B
Hi, you could try ordering the values in the query you are getting the positions inside the contacts.

If not you will have to write a custom controller, check this link that may help you
http://onlysalesforce.blogspot.com/2013/08/custom-sort-feature-in-salesforce-based.html
If it helps,please mark as correct,it may help others.
David Zhu 🔥David Zhu 🔥
You may use the following code snippet as reference. It is pretty easy and straigh forward.

1. For each apex:column, change the code as below. 
<apex:column value="{!b.Name}">
    <apex:facet name="header">
            <apex:commandLink action="{!queryData}" value="Name{!sortExpression=='Name',IF(sortDirection='ASC','▼','▲'),'')}" id="sortName" reRender="contactPanel" status="spinner">
                <apex:param value="Name" name="column" assignTo="{!sortExpression}" ></apex:param>
            </apex:commandLink>
    </apex:facet>
</apex:column>
2. Add the following code 
private String sortExp = 'name';
    public String sortExpression
    {
        get
        {
            return sortExp;
        }
        set
        {
            //if the column is clicked on then switch between Ascending and Descending modes
            if (value == sortExp)
            {
                sortDirection = (sortDirection == 'ASC')? 'DESC' : 'ASC';
            }
            else
            {
                sortDirection = 'ASC';
            }
            sortExp = value;
        }
    }

    public String sortDirection
    {
        get
        {
            //if no column is selected
            if (sortExpression == null || sortExpression == '')
                return 'ASC';
            else
                return sortDirection;
        }
        Set
        {
            sortDirection = value;
        }
    }

3. Build you query function. You need to change accordinlgy. 
public void queryData()
{

    String queryString = 'SELECT Id,name,xxx,xxxx FROM Contact';   //select all fields

    switch on  sortExpression
    {
        when 'productName'
        {
            queryString += ' ORDER BY Product__r.Name ' + sortDirection;
        }
        when 'Name'
        {
            queryString += ' ORDER BY Name ' + sortDirection;
        }
        when else
        {
            ......
        }
    }

    if (sortDirection == 'ASC')
    {
        queryString += ' NULLS First';
    }
    else
    {
        queryString += ' NULLS LAST';
    }

    queryString += ' LIMIT 9500';

    List<yourobject> DataList = Database.query(queryString); //pass the result to the object to be displayed on VF page

}










 
This was selected as the best answer
Chad RitchieChad Ritchie
Thank you very much for the reply! Would the second and third pieces go in a seperate Visualforce component?
David Zhu 🔥David Zhu 🔥
Add to controller