Стратегия Facelets для идентификации текущего выбранного элемента списка - PullRequest
Новая
       4

Стратегия Facelets для идентификации текущего выбранного элемента списка

2 голосов
/ 22 августа 2011

Я ищу стратегию, позволяющую избежать дублирования кода на моем сайте.

Проблема в том, что у меня есть неупорядоченный список, который повторяется на каждой кодируемой странице. Причина в том, что у меня есть элемент списка, который содержит привязку для идентификации currentPage. Это повторяется на каждой странице, которую я кодирую. Причина в том, что у меня есть элемент списка, который содержит привязку для идентификации currentPage. Это позволяет мне скрыть это с помощью CSS.

Как я могу определить такой список таким образом, чтобы я мог динамически изменять его в фасетах? 

<ui:define name="leftBar">
        <ul class="leftNav">
            <li id="home"><a id="**currentPage**" jsfc="h:link" outcome="home">#{global.homeInCaps}</a></li>
            <li id="about"><a jsfc="h:link" outcome="about">#{global.aboutInCaps}</a></li>
            <li id="blog"><a jsfc="h:link" outcome="blog">#{global.blogInCaps}</a></li>
            <li id="tutorials"><a jsfc="h:link" outcome="tutorials">#{global.tutorialsInCaps}</a>
                <ul class="leftSubNav">
                    <li><a jsfc="h:link" outcome="java">#{global.javaNormal}</a>
                        <ul class="leftSubNav">
                            <li><a jsfc="h:link" outcome="setupPath">#{global.path}</a></li>
                        </ul>
                    </li>
                    <li><a jsfc="h:link" outcome="ubuntu">#{global.ubuntuNormal}</a></li>
                    <li><a jsfc="h:link" outcome="virtualbox">#{global.virtualBoxNormal}</a></li>
                </ul>
            </li>
            <li id="contact"><a jsfc="h:link" outcome="contact">#{global.contactInCaps}</a></li>
        </ul>

    </ui:define>

1 Ответ

2 голосов
/ 22 августа 2011

В JSF вы можете получить текущий идентификатор представления по 

#{facesContext.viewRoot.viewId}

. Он вернет относительный к веб-контенту путь к файлу представления, например, /home.xhtml, /about.xhtml и т. Д. Вы можете проверить егос помощью условного оператора в EL для задания имени класса. 

<ui:param name="view" value="#{facesContext.viewRoot.viewId}" />

<li id="home"><a jsfc="h:link" outcome="home" class="#{view == '/home.xhtml' ? 'current' : ''}">#{global.homeInCaps}</a></li>
<li id="about"><a jsfc="h:link" outcome="about" class="#{view == '/about.xhtml' ? 'current' : ''}">#{global.aboutInCaps}</a></li>
<li id="blog"><a jsfc="h:link" outcome="blog" class="#{view == '/blog.xhtml' ? 'current' : ''}">#{global.blogInCaps}</a></li>
...

Затем можно стилизовать ссылку, представляющую текущую страницу, с помощью CSS 

.leftNav .current {
    color: pink;
}

Не следует лиleftNav точнее будет id?

...