当前位置: 代码迷 >> Web前端 >> richfaces 的信息揭示(尽可能多的方式)
  详细解决方案

richfaces 的信息揭示(尽可能多的方式)

热度:513   发布时间:2012-11-06 14:07:00.0
richfaces 的信息提示(尽可能多的方式)
  大家如果有什么好的方法,分享出来哦

  jsf 本身很强大,很多功能都实现了,程序员只需要调用它的组件,BUT虽然jsf有很多组件,有时的确不满足当前需求,比如信息提示,下面列出最常用的3种。
  1)直接alert (简单了吧,嘿嘿)
  2)用模态窗口来输出信息 (这个有点难)
  3)在页面的一个专门的div用ajax来输出信息
 
  jsf从后台传给前台的信息有两种方式,在本文中用第二种方式
  a)先把信息设置到jsf的Bean中,再在jsf页面中用el取出来就是
  b)用jsf的message组件
后台
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage("保存成功"));

页面
<rich:messages ></rich:messages>

  好了,现在开始用richfaces来实现信息提示
  通过自己的理解加g.cn 加 baidu.com 其实richfaces里用alert是最难的,所以把alert放在最后吧,倒是2),3)实现起来比较方便
  1)先来模态窗口

  首先是userBean
@ManagedBean(name = "userBean")
@SessionScoped
public class UserBean implements Serializable {
	private String name;
	private String password;
	
	public void login(ActionEvent event){
		FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(name + " login 成功"));
	}
	
	public String getName() {
		return name;
	}

	public void setName(String newValue) {
		name = newValue;
	}

	public String getPassword() {
		return password;
	}

	public void setPassword(String newValue) {
		password = newValue;
	}
}

  然后是页面
   <body>
	<rich:modalPanel id="messagePanel" width="350" height="100" >
        <f:facet name="header">
            <h:panelGroup>
                <h:outputText value="Modal Panel"></h:outputText>
            </h:panelGroup>
        </f:facet>
        <f:facet name="controls">
            <h:panelGroup>
                <h:graphicImage value="/images/close.png" styleClass="hidelink" id="hidelink"/>
                <rich:componentControl for="messagePanel" attachTo="hidelink" operation="hide" event="onclick"/>
            </h:panelGroup>
        </f:facet>
				<h:panelGroup >
					<rich:messages ></rich:messages>
				</h:panelGroup>									
    </rich:modalPanel> 	   
      <h:form>
         <h3>Please enter your name and password.</h3>   
         <table>
            <tr>
               <td>Name:</td>
               <td><h:inputText value="#{userBean.name}"/></td>
            </tr>
            <tr>
               <td>Password:</td>
            </tr>
         </table>
         <p><a4j:commandButton value="Login" actionListener="#{userBean.login}" reRender="messagePanel" oncomplete="#{rich:component('messagePanel')}.show()"></a4j:commandButton></p>
      </h:form>
   </body>

效果图如下



  but如果每个按钮都写oncomplete="#{rich:component('messagePanel')}.show()"成这样就太复杂了所以就有了升级版
 
   <body>
   <h:panelGroup id="messageGroup" >
		<rich:modalPanel id="messagePanel" width="350" height="100" showWhenRendered="true" rendered="#{!empty facesContext.maximumSeverity}"> 
	        <f:facet name="header">
	            <h:panelGroup>
	                <h:outputText value="Modal Panel"></h:outputText>
	            </h:panelGroup>
	        </f:facet>
	        <f:facet name="controls">
	            <h:panelGroup>
	                <h:graphicImage value="/images/close.png" styleClass="hidelink" id="hidelink"/>
	                <rich:componentControl for="messagePanel" attachTo="hidelink" operation="hide" event="onclick"/>
	            </h:panelGroup>
	        </f:facet>
					<h:panelGroup >
						<rich:messages ></rich:messages>
					</h:panelGroup>									
	    </rich:modalPanel> 	 
    </h:panelGroup>  
      <h:form>
         <h3>Please enter your name and password.</h3>   
         <table>
            <tr>
               <td>Name:</td>
               <td><h:inputText value="#{userBean.name}"/></td>
            </tr>
            <tr>
               <td>Password:</td>
            </tr>
         </table>
         <p><a4j:commandButton value="Login" actionListener="#{userBean.login}" reRender="messageGroup" ></a4j:commandButton></p>
      </h:form>
   </body>
  

  2)专门的div用ajax来输出信息,这个在richfaces里简直是太简单了
 
   <body>
      <h:form>
         <h3>Please enter your name and password.</h3>   
         <table>
            <tr>
               <td>Name:</td>
               <td><h:inputText value="#{userBean.name}"/></td>
            </tr>
            <tr>
               <td>Password:</td>
            </tr>
         </table>
         <p><a4j:commandButton value="ajaxLogin" actionListener="#{userBean.login}"  ></a4j:commandButton></p>
         <h:panelGroup >
			<rich:messages ></rich:messages>
		</h:panelGroup>		
      </h:form>
   </body>
  

  效果图为


先就写到这吧有时间了再写
1 楼 ella110727 2011-07-28  
挺清楚的。可是FacesContext这个方法没法调用呢?why?
2 楼 li2005 2011-08-17  
我用的是JSF2.0,你得确认你的bean是不是在JSF容器里头
ella110727 写道
挺清楚的。可是FacesContext这个方法没法调用呢?why?

我用的是JSF2.0,你得确认你的bean是不是在JSF容器里头
3 楼 yuanliyin 2011-10-08  
备注一下下