1

I have a custom component with a dataList component within:

<apex:dataList value="{!itemsList}" var="item" type="{! listType }">
    <apex:outputText value="{!item}"/>
</apex:dataList>

This works well, except that the type attribute doesn't work. The output looks like this:

<ul id="j_id0:emailTemplate:j_id3:j_id4:j_id18:j_id19:j_id20" type="1">
    <li id="j_id0:emailTemplate:j_id3:j_id4:j_id18:j_id19:j_id20:0">Something</li>
    <li id="j_id0:emailTemplate:j_id3:j_id4:j_id18:j_id19:j_id20:1">Something else</li>
    <li id="j_id0:emailTemplate:j_id3:j_id4:j_id18:j_id19:j_id20:2">Something more</li>
    <li id="j_id0:emailTemplate:j_id3:j_id4:j_id18:j_id19:j_id20:3">Something too</li>
</ul>

Notice how the type is set, but the list is unordered. I assume that a value of 1 would indicated an ordered list. I've also tried A with no change.

From the docs:

The type of list that should display. For ordered lists, possible values include "1", "a", "A", "i", or "I". For unordered lists, possible values include "disc", "square", and "circle". If not specified, this value defaults to "disc".

I've also tried omitting the type attribute, which does not apply the value disc as the docs imply it should.

What's the problem?

Improve this question
0

1 Answer 1

Reset to default
1

You are right, documentation seems to be incorrect as Visualforce engine seems to always generate apex:dataList as an unorder list in HTML; hence it defaults to disc.

This could be due to the fact that the type attribute on ordered list was deprecated in HTML4, but reintroduced in HTML5. For type attribute, the documentation for <ol> in mozilla says:

Unless the value of the list number matters (e.g. in legal or technical documents where items are to be referenced by their number/letter), the CSS list-style-type property should be used instead.

In case if its absolutely needed, you could style the list with list-style-type, some exampe values as lower-roman, upper-roman, etc. small example

<!-- pardon the inline style, ideally CSS should be via style classes -->
<apex:dataList value="{!itemsList}" var="item" type="{! listType }" 
    style="list-style-type: lower-roman;">
Improve this answer
6
  • Thanks. I'm actually looking to toggle the list as ordered or unordered based on a component attribute and don't care much about style. I guess I'll be duplicating markup and using rendered.
    – isherwood
    Commented Jun 14, 2019 at 15:52
  • Better approach would be to make the style class dynamic based on whether its order or unordered list. For instance, style="{!IF(ListType == 'ordered', 'list-style-type: lower-roman;', '')}"
    – Raul
    Commented Jun 14, 2019 at 15:55
  • I don't understand. There won't be a style class. I'm merely looking to let the component user indicate whether an ol or ul list type is desired.
    – isherwood
    Commented Jun 14, 2019 at 15:56
  • Not really sure about your use case, but what I am saying is you could style the apex:dataList to look like an order or unorder list with CSS conditionally
    – Raul
    Commented Jun 14, 2019 at 15:58
  • Ah, as in list-style-type: decimal to convert a UL to an OL. Nice.
    – isherwood
    Commented Jun 14, 2019 at 18:58

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .