JSF - создайте динамическое меню с помощью AJAX и selectOneListbox - PullRequest
Новая
       5

JSF - создайте динамическое меню с помощью AJAX и selectOneListbox

3 голосов
/ 29 ноября 2010

То, что я хотел бы сделать, легко объяснить:

bean

@ManagedBean
@ViewScoped
public class Articles {
    private String selectedMenu;

    @PostConstruct
    public void init() {
        if(selectedMenu==null || selectedMenu.trim().isEmpty()) {
            this.selectedMenu="0";
        }
    }

    public String getSelectedMenu() { return selectedMenu; }
    public void setSelectedMenu(String selectedMenu) { this.selectedMenu = selectedMenu; }
}

page

<h:selectOneListbox onchange="..?? ajax call that render on loadMenu and pass the value of the focused listbox to Articles Bean" id="category" size="0" >
    <f:selectItem itemLabel="first" itemValue="0" />
    <f:selectItem itemLabel="second" itemValue="1" />
    <f:selectItem itemLabel="third" itemValue="2" />
</h:selectOneListbox>

<h:panelGroup layout="block" id="loadMenu">
    <h:panelGroup rendered="#{articles.selectedMenu=='0'}">
        MENU 0
    </h:panelGroup>

    <h:panelGroup rendered="#{articles.selectedMenu=='1'}">
        MENU 1
    </h:panelGroup>

    <h:panelGroup rendered="#{articles.selectedMenu=='2'}">
        MENU 2
    </h:panelGroup>
</h:panelGroup>

Когда я изменяю значениеиз списка, меню должно динамически меняться (вызывая некоторую функцию на сервере).Я думаю, что приведенный выше код выражает то, что я ищу.

Я должен знать, как вызвать его с помощью опции onchange.Возможно ли это?

Приветствия

ОБНОВЛЕНИЕ 

<h:panelGroup layout="block">
    <h:selectOneListbox styleClass="article_combo" size="0" id="selectedMenu" >
        <f:selectItem itemLabel="first" itemValue="0" />
        <f:selectItem itemLabel="second" itemValue="1" />
        <f:selectItem itemLabel="third" itemValue="2" />

        <f:ajax event="change" execute="@this" render="loadMenu" />
    </h:selectOneListbox>
</h:panelGroup>

<h:panelGroup layout="block" id="loadMenu">
    <h:panelGroup rendered="#{articles.selectedMenu=='0'}">
        MENU 0
    </h:panelGroup>

    <h:panelGroup rendered="#{articles.selectedMenu=='1'}">
        MENU 1
    </h:panelGroup>

    <h:panelGroup rendered="#{articles.selectedMenu=='2'}">
        MENU 2
    </h:panelGroup>
</h:panelGroup>

1 Ответ

3 голосов
/ 30 ноября 2010

Для этого вы можете использовать поддержку ajax, встроенную в JSF 2. Для этого вложите тег f: ajax в свой тег h: selectOneListbox. Тег f: ajax должен выглядеть следующим образом: 

<f:ajax render="loadMenu" execute="@this" />

Это должно обработать измененное значение в вашем списке и заново отрендерить PanelGroup.

для получения более подробной информации см .: http://mkblog.exadel.com/2010/04/learning-jsf-2-ajax-in-jsf-using-fajax-tag/

...