2

<p:submenu />で使用するために へのリンクを追加するにはどうすればよい<p:megaMenu>ですか?

例えば:

<!DOCTYPE html>
<ui:composition xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    template="/pages/template/homeTemplate.xhtml">

    <ui:define name="content">
        <p:megaMenu>
            <p:submenu label="Home" url="/" />
            <p:submenu label="Category" url="/cats">
                <p:column>
                    <p:submenu label="Category 1" url="/cats/cat1">
                        <p:menuitem value="Item 1" url="/cats/cat1/item1"/>
                        <p:menuitem value="Item 2" url="/cats/cat1/item2"/>
                        <p:menuitem value="Item 3" url="/cats/cat1/item3"/>
                    </p:submenu>
                </p:column>
            </p:submenu>
        </p:megaMenu>  
    </ui:define>

</ui:composition>

<p:submenu />には属性urlがないため、無視されます。代わりに何ができますか?

4

1 に答える 1

4

私はこの問題に直面していました。多くの人が、primefaces がサポートしていないため不可能だと言っているのを見つけました。

<ui:composition xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    template="/pages/template/homeTemplate.xhtml">

    <ui:define name="content">
        <p:megaMenu id="megaMenu">
            <p:submenu label="Home" url="/" styleClass="homeLink" />
            <p:submenu label="Category" url="/cats" styleClass="catLink">
                <p:column>
                    <p:submenu label="Category 1" styleClass="cat1Link">
                        <p:menuitem value="Item 1" url="/cats/cat1/item1"/>
                        <p:menuitem value="Item 2" url="/cats/cat1/item2"/>
                        <p:menuitem value="Item 3" url="/cats/cat1/item3"/>
                    </p:submenu>
                </p:column>
            </p:submenu>
        </p:megaMenu>
        <script type="text/javascript">
        $(function(){
            $(".homeLink a:first").attr('href', "#{request.contextPath}/");
            $(".catLink a:first").attr('href', "#{request.contextPath}/cats");
            $(".cat1Link").click(function(){
                window.location.href="#{request.contextPath}/cats/cat1";
            }).css('cursor','pointer');
        });
        </script>
    </ui:define>

</ui:composition>

ここで私がしたことは次のとおりです。

1)私<p:submenu>は排他的ですべてを定義しましたstyleClass

2)<p:submenu>が最初の行にある場合は、DOM の準備ができた後で、<a>href属性をリンクに変更しました。

$(function(){
    $(".homeLink a:first").attr('href', "#{request.contextPath}/");
    $(".catLink a:first").attr('href', "#{request.contextPath}/cats");
});

3)<p:submenu>がメニューの一部である場合、タグがonclickないため、属性を作成し、カーソルをポインターにカスタマイズしました。<a>

$(".cat1Link").click(function(){
    window.location.href="#{request.contextPath}/cats/cat1";
}).css('cursor','pointer');

これにより、必要なメニューが作成されました。もちろん、javascript が無効になっていると機能しませんが、javascript が有効なブラウザーでメニューが機能するようになりました。

于 2012-12-14T03:46:25.310 に答える