twitter bootstrap下拉和primefaces命令按钮

时间:2014-03-15 11:05:45

标签: twitter-bootstrap primefaces

我在我的模板中使用了twitter bootstrap:

这是模板代码:

<h:head>
    <f:facet name="first">
        <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
        <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
        <title>Core Project -Default Title-</title>
        <link rel="shortcut icon" type="image/png"
            href="#{request.contextPath}/resources/images/favicon.png" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <!-- Bootstrap -->
        <link
            href="#{request.contextPath}/resources/bootstrap/css/bootstrap.css"
            rel="stylesheet" media="screen" />
        <link
            href="#{request.contextPath}/resources/bootstrap/css/helper/submenu.css"
            rel="stylesheet" media="screen" />

        <link type="text/css" rel="stylesheet"
            href="#{request.contextPath}/resources/font-awesome-4.0.3/css/font-awesome.min.css" />

        <link type="text/css" rel="stylesheet"
            href="#{request.contextPath}/resources/css/default.css" />
    </f:facet>
</h:head>

<h:body>



    <!-- Fixed navbar -->
    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse"
                    data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span> <span
                        class="icon-bar"></span> <span class="icon-bar"></span> <span
                        class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">Core Project</a>
            </div>
            <div class="navbar-collapse collapse">
                <h:form id="navForm">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="#{request.contextPath}/home"><h:outputText
                                    value="#{msgs['core.home']}" /> </a></li>
                        <li><a href="#about"><h:outputText
                                    value="#{msgs['core.about']}" /></a></li>
                        <li class="dropdown"><a href="#" class="dropdown-toggle"
                            data-toggle="dropdown"><h:outputText
                                    value="#{msgs['core.selectLanguage']}" /> <b class="caret"></b></a>
                            <ul class="dropdown-menu">
                                <li><h:commandLink id="englishLink"
                                        value="#{msgs['core.language.english']}"
                                        immediate="true" action="#{localeManager.applyNewLocale}">
                                        <f:param name="lang" value="en" />
                                    </h:commandLink></li>
                                <li><h:commandLink value="#{msgs['core.language.farsi']}" 
                                        immediate="true" id="farsiLink"
                                        action="#{localeManager.applyNewLocale}">
                                        <f:param name="lang" value="fa" />
                                    </h:commandLink></li>

                            </ul></li>
                    </ul>
</h:form>

所有下拉列表在页面中都能正常工作,但是当我有类似的东西时:

<ui:define name="content">
    <div class="entry" style="line-height: 200%">
        <h1>Home Page</h1>
    </div>

    <h:form id="testForm">
        <p:commandButton action="home2" value="test" id="homeBTM" />
    </h:form>

导航栏的所有下降停止工作。 如果有人能帮助我找出问题所在,我很感激。 日Thnx

1 个答案:

答案 0 :(得分:0)

最后我发现,primefaces 4导致了这一点。如果我降级到primefaces 3.5,一切都会很好。顺便说一句,我没有找出PF 4导致这个问题的原因!