<h：form> <li>影响布局显示</li> </h：form>

Question

我正在使用带有JSF primefaces的bootstrap模板。

这是基于我的默认引导程序模板的。

在我添加jsf：action调用staffBean.logoutStaff（）方法之后，这是我的.xhtml代码。我得到了一个＆＃34;这个链接被禁用，因为它没有嵌套在一个jsf表格中＃34;我的页面加载时出错。因此，我按照我在stackoverflow中找到的解决方案的建议将标签添加到注销部分。

的index.xhtml

 <div class="dropdown profile-element"> <span>
                                    <h:graphicImage class="img-circle" library="images" name="profile_small.jpg" />
                                </span>
                                <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                                    <span class="clear"> <span class="block m-t-xs"> <strong class="font-bold">#{staffBean.staff.firstName}</strong>
                                        </span> <span class="text-muted text-xs block">#{staffBean.staff.userType} <b class="caret"></b></span> </span> </a>
                                <ul class="dropdown-menu animated fadeInRight m-t-xs">
                                    <li><a href="profile.html">Profile</a></li>
                                    <li><a href="contacts.html">Contacts</a></li>
                                    <li><a href="mailbox.html">Mailbox</a></li>
                                    <li class="divider"></li>
                                    <li><h:form><a href="logout.xhtml" jsf:action="#{staffBean.logoutStaff()}">Logout</a></h:form></li>
                                </ul>
                            </div>

添加标签后，我的注销码可以正常运行。但是，h：form标签导致我的布局发生了一些奇怪的变化。变化如下。与上面的3个组件相比，Logout部分似乎更轻。

对可能出现的问题有什么看法？是否与hform标签有关？

Answer 1

我设法解决了这个问题。

我把标签放在li标签之外。

 <div class="dropdown profile-element">
                                <h:form>

                                    <span>
                                        <h:graphicImage class="img-circle" library="images" name="profile_small.jpg" />
                                    </span>
                                    <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                                        <span class="clear"> <span class="block m-t-xs"> <strong class="font-bold">#{staffBean.staff.firstName}</strong>
                                            </span> <span class="text-muted text-xs block">#{staffBean.staff.userType} <b class="caret"></b></span> </span> </a>
                                    <ul class="dropdown-menu animated fadeInRight m-t-xs">
                                        <li><a href="profile.html">Profile</a></li>
                                        <li><a href="contacts.html">Contacts</a></li>
                                        <li><a href="mailbox.html">Mailbox</a></li>
                                        <li class="divider"></li>
                                        <li><a href="logout.xhtml" jsf:action="#{staffBean.logoutStaff()}">Logout</a></li>
                                    </ul>

                                </h:form>
                            </div>