0

我在 IE 上运行我的 jsf 应用程序时遇到问题。

on jsf 行为错误，selectcheckboxmenu并且菜单项的复选框移动到项目下方，复选框仍然存在。下面是我所面临的截图： TinyPic 的图像和视频托管

[IMG] http://i43.tinypic.com/8yb976.jpg[/IMG]

selectcheckboxmenu 的代码如下：

<p:selectCheckboxMenu value="#{formBean.selectedMovies}" label="Movies"
    filter="true" filterText="Filter" filterMatchMode="startsWith"
    panelStyle="width:220px">
    <f:selectItems value="#{formBean.movies}" />
</p:selectCheckboxMenu>

请告诉我我哪里出错了，出了什么问题。提前致谢。

4

2 回答 2

2

IE 存在兼容性问题。Primefaces 在 IE9 兼容性上运行良好。因此，您的复选框无法正常工作。

我经历过同样的问题。所以你必须通过使用 jsf 的生命周期来设置 Compatibility 视图

public class UACompatibleHeaderPhaseListener implements PhaseListener {
@Override
public void afterPhase(PhaseEvent arg0){}

@Override
public void beforePhase(PhaseEvent event){
    final FacesContext facesContext = event.getFacesContext();
    final HttpServletResponse response = (HttpServletResponse) facesContext.getExternalContext().getResponse();
    response.addHeader("X-UA-Compatible", "IE=edge");
}

@Override
public PhaseId getPhaseId() {
     return PhaseId.RENDER_RESPONSE;
}
}

在你的 Faces-config.xml 中，只需放置带有包名的类

<lifecycle>
   <phase-listener>
     com.jsf.listener.UACompatibleHeaderPhaseListener
   </phase-listener>
</lifecycle>
于 2013-10-07T10:23:14.107 回答
1

我用css属性'vertical-align'修复了它，

div.ui-selectcheckboxmenu.ui-widget{
width: 100% !important;
}
div.ui-widget-header.ui-corner-all.ui-selectcheckboxmenu-header.ui-helper-clearfix{
padding: 3px !important;

}
input.ui-inputfield.ui-inputtext.ui-widget.ui-state-default.ui-corner-all{

width: 90% !important;

}
div.ui-chkbox-box.ui-widget.ui-corner-all{
vertical-align: top !important;
margin-top: 3px !important;
}
div.ui-selectcheckboxmenu-filter-container{
width:75% !important;
vertical-align: top !important;
margin-left: 2px !important;
}

在 Firefox、chrome 和 ie9 上测试。

于 2014-02-23T11:25:01.407 回答