2010-11-18 15 views
11

Chcę wyświetlić strukturę drzewa w moim menu rozwijanym w JSF. Zasadniczo wybrane pozycje są w hierarchii i chciałbym, aby było to widoczne na liście rozwijanej.Drzewo JSF w rozwijanym menu

Czy to możliwe?

+0

drzewo w polu kombi. Nie mogę sobie wyobrazić, jak go użyć, możesz rozwinąć] –

+2

Zakładam, że on faktycznie oznacza rozwijanie jak w 'h: selectOneMenu', a nie combobox (który jest edytowalnym rozwijanym menu). – BalusC

Odpowiedz

24

Więc w zasadzie chcą HTML <optgroup>? Użyj SelectItemGroup.

JSF fasoli (zakładam JSF 1.x): widok

private String option; // +getter +setter 
private List<SelectItem> options; // +getter 

public Bean() { 
    options = new ArrayList<SelectItem>(); 

    SelectItemGroup group1 = new SelectItemGroup("Group 1"); 
    group1.setSelectItems(new SelectItem[] { 
     new SelectItem("Group 1 Value 1", "Group 1 Label 1"), 
     new SelectItem("Group 1 Value 2", "Group 1 Label 2"), 
     new SelectItem("Group 1 Value 3", "Group 1 Label 3") 
    }); 
    options.add(group1); 

    SelectItemGroup group2 = new SelectItemGroup("Group 2"); 
    group2.setSelectItems(new SelectItem[] { 
     new SelectItem("Group 2 Value 1", "Group 2 Label 1"), 
     new SelectItem("Group 2 Value 2", "Group 2 Label 2"), 
     new SelectItem("Group 2 Value 3", "Group 2 Label 3") 
    }); 
    options.add(group2); 
} 

JSF:

<h:selectOneMenu value="#{bean.option}"> 
    <f:selectItems value="#{bean.options}" /> 
</h:selectOneMenu> 

Generated przykład HTML:

<select name="j_idt6:j_idt7" size="1"> 
    <optgroup label="Group 1"> 
     <option value="Group 1 Value 1">Group 1 Label 1</option> 
     <option value="Group 1 Value 2">Group 1 Label 2</option> 
     <option value="Group 1 Value 3">Group 1 Label 3</option> 
    </optgroup> 
    <optgroup label="Group 2"> 
     <option value="Group 2 Value 1">Group 2 Label 1</option> 
     <option value="Group 2 Value 2">Group 2 Label 2</option> 
     <option value="Group 2 Value 3">Group 2 Label 3</option> 
    </optgroup> 
</select> 

Jak to wygląda w przeglądarce:

alt text

+2

+1 dla optgroup! –

+1

Czy to działa dla selectManyMenu ??? Chcę użyć tego w selectManyMenu. – deepmoteria

+4

Skały BalusC !!! – arthur

1

Nie jestem pewien, czy rozumiem, o co prosisz. Zakładając, że podkategorie w menu mają być lekko wcięte? Jeśli tak, to co powiesz na wysyłanie z serwera/obsługi tablicy elementów sparsowanych z "& nbsp" (spacja) lub "-".
Innymi słowy, nie można używać javascript do analizowania i rozumienia hierarchii kategorii. Masz 2 opcje - albo uruchom rekurencję za pomocą JSF (brzmi to skomplikowanie i brzydko dla osoby, która musi zaprojektować stronę), albo sortuj po stronie serwera, zapewniając JSF z wcięciami z wcięciem.

Nadzieja to pomaga,

Yishai

+0

Tak, masz prawo, moje opcje są pogrupowane w kategorie i każda z kategorii ma również kilka opcji pod nimi. –

0

Grupy zagnieżdżone nie są wizualizowane poprawnie. Pojawiają się jako przedmiot, a nie jako grupa.

Powiązane problemy