richfaces4 布局 panelMenu保持选中状态
程序员文章站
2024-03-12 20:10:50
...
布局文件
/richfaces-demo/webapp/masterLayout.xhtml
布局CSS
/richfaces-demo/webapp/resources/css/layout.css
全局CSS
/richfaces-demo/webapp/resources/css/style.css
菜单页面
/richfaces-demo/webapp/menu.xhtml
第一个页面
/richfaces-demo/webapp/index.xhtml
第二个页面
/richfaces-demo/webapp/main.xhtml
两个Bean
/richfaces-demo/src/test/MenuBean.java
/richfaces-demo/src/test/MenuState.java
/richfaces-demo/webapp/masterLayout.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<h:head>
<title></title>
<h:outputStylesheet library="css" name="style.css"/>
<h:outputStylesheet library="css" name="layout.css"/>
</h:head>
<h:body>
<div id="heading"></div>
<div id="menu">
<ui:insert name="menu">
<ui:include src="menu.xhtml"/>
</ui:insert>
</div>
<div id="content">
<ui:insert name="content">
</ui:insert>
</div>
</h:body>
</html>
布局CSS
/richfaces-demo/webapp/resources/css/layout.css
@CHARSET "UTF-8";
#heading {
width: 100%;
height: 30px;
background-color: blue;
}
#menu {
float: left;
width: 240px;
height: 400px;
background-color: orange;
}
#content {
width: 100%;
height: 400px;
background-color: gray;
}
全局CSS
/richfaces-demo/webapp/resources/css/style.css
@CHARSET "UTF-8";
*{ margin:0; padding:0;}
body {
font-size: 12px;
}
菜单页面
/richfaces-demo/webapp/menu.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<ui:composition>
<h:form>
<h:outputText value="#{param.groupId}" />
<br />
<rich:panelMenu style="width:200px" mode="client"
selectedChild="#{menuState.selectedMenuItem}"
iconExpandedGroup="disc" iconCollapsedGroup="disc"
iconExpandedTopGroup="chevronUp" iconGroupTopPosition="right"
iconCollapsedTopGroup="chevronDown" iconCollapsedTopPosition="right"
activeItem="#{menuState.selectedMenuItem}">
<rich:panelMenuGroup label="Group 1" id="group1"
value="#{menuState.menu['group1']}"
expanded="#{'group1' == param.groupId}">
<rich:panelMenuItem label="Item 1" id="group1_item1"
actionListener="#{menuBean.select}" action="/main.xhtml">
<f:param name="groupId" value="group1" />
</rich:panelMenuItem>
<rich:panelMenuItem label="Item 2" id="group1_item2"
actionListener="#{menuBean.select}" action="/main.xhtml">
<f:param name="groupId" value="group1" />
</rich:panelMenuItem>
<rich:panelMenuItem label="Item 3" id="group1_item3"
actionListener="#{menuBean.select}" action="/main.xhtml">
<f:param name="groupId" value="group1" />
</rich:panelMenuItem>
</rich:panelMenuGroup>
<rich:panelMenuGroup label="Group 2" id="group2"
value="#{menuState.menu['group2']}"
expanded="#{'group2' == param.groupId}">
<rich:panelMenuItem label="Item 1" id="group2_item1"
actionListener="#{menuBean.select}" action="/index.xhtml">
<f:param name="groupId" value="group2" />
</rich:panelMenuItem>
<rich:panelMenuItem label="Item 2" id="group2_item2"
actionListener="#{menuBean.select}" action="/index.xhtml">
<f:param name="groupId" value="group2" />
</rich:panelMenuItem>
<rich:panelMenuItem label="Item 3" id="group2_item3"
actionListener="#{menuBean.select}" action="/index.xhtml">
<f:param name="groupId" value="group2" />
</rich:panelMenuItem>
</rich:panelMenuGroup>
</rich:panelMenu>
</h:form>
</ui:composition>
</html>
第一个页面
/richfaces-demo/webapp/index.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<h:head>
<title></title>
<h:outputStylesheet library="css" name="style.css" />
<h:outputStylesheet library="css" name="layout.css" />
</h:head>
<h:body>
<ui:composition template="/masterLayout.xhtml">
<ui:define name="content">第一个页面</ui:define>
</ui:composition>
</h:body>
</html>
第二个页面
/richfaces-demo/webapp/main.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:rich="http://richfaces.org/rich"
xmlns:a4j="http://richfaces.org/a4j">
<h:head>
<title></title>
<h:outputStylesheet library="css" name="style.css"/>
<h:outputStylesheet library="css" name="layout.css"/>
</h:head>
<h:body>
<ui:composition template="/masterLayout.xhtml">
<ui:define name="content">第二个页面</ui:define>
</ui:composition>
</h:body>
</html>
两个Bean
/richfaces-demo/src/test/MenuBean.java
package test;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ManagedProperty;
import javax.faces.bean.RequestScoped;
import javax.faces.event.ActionEvent;
@ManagedBean
@RequestScoped
public class MenuBean implements Serializable {
private static final long serialVersionUID = 1L;
@ManagedProperty(value = "#{menuState}")
private MenuState menuState;
public MenuState getMenuState() {
return menuState;
}
public void setMenuState(MenuState menuState) {
this.menuState = menuState;
}
public MenuBean() {
}
public void select(ActionEvent event) {
menuState.setSelectedMenuItem(event.getComponent().getId());
}
}
/richfaces-demo/src/test/MenuState.java
package test;
import java.io.Serializable;
import java.util.HashMap;
import java.util.Map;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean
@SessionScoped
public class MenuState implements Serializable {
private static final long serialVersionUID = 1L;
private Map<String, Boolean> menu;
private String selectedMenuItem;
public String getSelectedMenuItem() {
return selectedMenuItem;
}
public Map<String, Boolean> getMenu() {
return menu;
}
public void setMenu(Map<String, Boolean> menu) {
this.menu = menu;
}
public void setSelectedMenuItem(String selectedMenuItem) {
this.selectedMenuItem = selectedMenuItem;
}
public MenuState() {
}
@PostConstruct
public void init() {
menu = new HashMap<String, Boolean>();
menu.put("group1", false);
menu.put("group2", false);
}
}
上一篇: 记一道有意思的题目
下一篇: java实现趣味拼算式
推荐阅读
-
richfaces4 布局 panelMenu保持选中状态
-
js实现翻页后保持checkbox选中状态的实现方法_javascript技巧
-
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态
-
el-table 筛选、复选框保持多选框选中状态
-
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态_jquery
-
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态_jquery
-
js实现翻页后保持checkbox选中状态的实现方法_javascript技巧
-
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态
-
richfaces4 布局 panelMenu保持选中状态 richfaces