Função

O componente Lista Ordenada é capaz de agrupar dois tipos de listas, são elas: Numéricas e Ordenadas.

Figura 1 - Lista ordenada rodando na web

Principais propriedades

Na tabela abaixo estão descritas as principais propriedades para o funcionamento básico do componente. Para acessa-las basta clicar sobre o componente.

Principais propriedades de configuração

Na tabela abaixo estão descritas as principais de configuração para o funcionamento básico do componente. 

Acessando as propriedades de configuração do componente

Para acessar as propriedades de configuração, precisamos clicar no elemento  do DOM cron-ordered-list#cron-ordered-list-<idDaLista>

Figura 2 - Acessando as propriedades de configuração do componente

1. Clique no elemento do DOM;
2. Acesse as propriedades de configuração do componenten.

Adicionando sublistas na lista ordenada

Para adicionar uma sublista na lista ordenada, selecione o componente Lista ordenada e arraste-o para a primeira lista ordenada que colocamos na view (figura 2.1). Obs: adicione a lista exatamente como mostra na figura 2.2, com a seta para baixo, dessa forma a sublista ficará dentro do Item 1,

Figura 2.1 - Adicionando e uma lista ordenada em outra lista ordenada

Adicionar/Remover item

Para acessar a propriedade itens, responsável pela adição e remoção dos itens do componente, podemos clicar sobre o componente (destaque 1 da figura 2.2) ou clicar sobre o elemento do DOM correspondente àquele elemento (destaque 2 da figura 2.2).

Figura 2.2 - Adicionando e removendo itens da lista ordenada.

1. Selecione o componente ou o elemento do DOM (cron-ordered-list#);
2. Para adicionar um item à lista, clique no ícone +;
3. Para remover um item da lista, clique no ícone da lixeira.

Exemplo

Para começar o nosso exemplo, adicione o componente Lista Ordenada à view e em seguida altere o nome dos itens, para isso, clique sobre um item e altere seu nome na propriedade Conteúdo.

Figura 3 - Alterando o nome dos itens.

Agora precisamos adicionar outra lista ordenada dentro da lista que colocamos na view, dessa forma estaremos criando uma lista com sublistas. Adicione a lista ordenada ao  item Frutas (item 1), como mostra a figura 2.1, em seguida, altere os nomes dos itens, da mesma forma que fizemos na figura 3. Para mudar o tipo de exibição da lista, altere a propriedade Tipo da lista para lista numerada  e na propriedade Valor do atributo numerado, selecione a opção Numeração (1,2,3...). Como mostra a figura 3.1

Figura 3.1 - Criando uma sublista.