+ Start a Discussion
John GardinerJohn Gardiner 

Display a numbered list on Visualforce Page

Hi,

I have a word document containing a numbered bullet point list. I need to display the text on a Visualforce page in the same style but can't figure out how to get the list styles to work. Could someone help me out?
Best Answer chosen by John Gardiner
Pasan   EeriyagamaPasan Eeriyagama
Hope below helps you.

Apex controlller
 
public class orderedlistcontroller {
	
    public List<string> getOL(){
        
        List<String> listStr = new List<String>();
        
        liststr.add('element1');
        liststr.add('element2');
        liststr.add('element3');
        return listStr;
    }
    
}

Visualforce:
 
<apex:page controller="orderedlistcontroller" >
    
    <ol type="1">
        <apex:repeat value="{!ol}" var="item">
            <li><apex:outputText value="{!item}"/></li>
        </apex:repeat>
    </ol>
    
</apex:page>

If you have sub items, I recommend you using Wrapper classes for the list.
 

 

All Answers

Pasan   EeriyagamaPasan Eeriyagama
Do you have sample data to copy paste here., or may be a screenshot ?
John GardinerJohn Gardiner
Hi Pasan, 

Due to the sensitivity of the information, I can't provide a copy of the actual data, but I have provided a sample data screen shot. I don't have any issues displaying the data other than that I can't figure out how to display the numbers and letters for each item. Typically using html <ol type="1"> and then putting each item inside <li> the numbers appear automatically. However, I can't get it to work in visualforce. Thanks for your help.

User-added image 
Pasan   EeriyagamaPasan Eeriyagama
Hope below helps you.

Apex controlller
 
public class orderedlistcontroller {
	
    public List<string> getOL(){
        
        List<String> listStr = new List<String>();
        
        liststr.add('element1');
        liststr.add('element2');
        liststr.add('element3');
        return listStr;
    }
    
}

Visualforce:
 
<apex:page controller="orderedlistcontroller" >
    
    <ol type="1">
        <apex:repeat value="{!ol}" var="item">
            <li><apex:outputText value="{!item}"/></li>
        </apex:repeat>
    </ol>
    
</apex:page>

If you have sub items, I recommend you using Wrapper classes for the list.
 

 
This was selected as the best answer