利用JSF组件实现实时从页面传参到back bean功能-h:selectOneMenu & f:attribute & h:inputHidden

 一、背景阐述
    
    页面利用dataTable显示多行记录，一行记录记录着一个用户的信息，其中用户状态的那个column用<h:selectOneMenu>显示，以便可以任意更改其状态。

    所以，现在就需要实现这样一个功能：当一个用户的状态改变了，需要将这个用户的id传到后台bean里，以便知道是哪个用户的状态改变了，然后在后台bean里对这个用户的信息做相应的处理。

二、实现方法

方法一、利用<h:selectOneMenu>&<f:attribute>实现实时从页面传参到back bean功能

1.页面代码：

1. <h:form>
2. <t:dataTable id="custRecordList" var="user"  value="#{backbeanName.custRecordList}" 
3.                styleClass=" " footerClass=" " headerClass=" "  columnClasses="" rowClasses=""
4.                align="center" cellpadding="4"  cellspacing="0" border="0" rows="45">
5.     <t:column>
6.         <f:facet name="header">
7.             <h:outputText value="User Status" />
8.         </f:facet>
9.         <h:selectOneMenu immediate="true" value="#{user.userStatus}"
10.              valueChangeListener="#{backbeanName.getUserNewStatus}" onchange="this.form.submit();">
11.             <f:selectItems value="#{backbeanName.userStatusSelectItems}"/>
12.             <f:attribute name="userId" value="#{user.userId}"/>
13.         </h:selectOneMenu>
14.     </t:column>
15. </t:dataTable>
16. 
    
18. <t:dataScroller id="scroller" for="custRecordList" style="position:relative;left:40px"
19.         fastStep="10" pageCountVar="pageCount" pageIndexVar="pageIndex" paginator="true" 
20.         paginatorMaxPages="10" paginatorActiveColumnStyle="font-weight:bold;text-decoration:none;"
21.         renderFacetsIfSinglePage="false">   
22. <f:facet name="first">
23.     <t:graphicImage id="firstImg" url="/shared/images/pagination/first.gif" border="1" />
24. </f:facet>
25. <f:facet name="last">
26.     <t:graphicImage id="lastImg" url="/shared/images/pagination/last.gif" border="1" />
27. </f:facet>
28. <f:facet name="previous">
29.     <t:graphicImage id="prevImg" url="/shared/images/pagination/previous.gif" border="1" />
30. </f:facet>
31. <f:facet name="next">
32.     <t:graphicImage id="nextImg" url="/shared/images/pagination/next.gif" border="1" />
33. </f:facet>
34. <f:facet name="fastforward">
35.     <t:graphicImage id="ffImg" url="/shared/images/pagination/fforward.gif" border="1" />
36. </f:facet>
37. <f:facet name="fastrewind">
38.     <t:graphicImage id="frImg" url="/shared/images/pagination/fbackward.gif" border="1" />
39. </f:facet>
40. </t:dataScroller>
41. </h:form>

2.后台bean里的代码：

1. public class BackBean {
3.   public void getUserNewStatus(ValueChangeEvent e){
4.      String userStatus=e.getNewValue();//得到user的新状态
5.      String userId=e.getComponent().getAttributes().get("userId").toString();//得到改变状态的user的id
6.     
7.      System.out.println("userStatus="+userStatus);
8.      System.out.println("userId="+userId);
9.     }
10. }

方法二、利用<h:selectOneMenu>&<h:inputHidden>实现实时从页面传参到back bean功能

1.页面代码：

1. <t:dataTable id="custRecordList" var="user"  value="#{backbeanName.custRecordList}" 
2.         styleClass=" " footerClass=" " headerClass=" "  columnClasses="" rowClasses=""
3.         align="center" cellpadding="4"  cellspacing="0" border="0" rows="45">
4.     <t:column>
5.         <f:facet name="header">
6.             <h:outputText value="User Status" />
7.         </f:facet>
8.             <h:form>
9.             <h:selectOneMenu immediate="true" value="#{user.userStatus}"
10.                     valueChangeListener="#{backbeanName.getUserNewStatus}" 
11.                     onchange="this.form.submit();" style="width:100px;">
12.                 <f:selectItems value="#{backbeanName.userStatusSelectItems}"/>
13.             </h:selectOneMenu>
14.             <h:inputHidden name="userId" value="#{user.userId}"/>
15.         </h:form>
16.     </t:column>
17. </t:dataTable>

2.后台bean里的代码：

1. public class BackBean {
3.     private HtmlInputHidden htmlInputHidden;
5.     public void getUserNewStatus(ValueChangeEvent e){
6.         String userStatus=e.getNewValue();//得到user的新状态
7.         String userId=htmlInputHidden.getValue().toString();//得到改变状态的user的id
8.     
9.         System.out.println("userStatus="+userStatus);
10.         System.out.println("userId="+userId);
11.     }
12. }

三、两种方法的比较

    以上两种方法都可以实现实时传参的功能，不同的是，第一种方法是把userId作为<h:selectOneMenu>的一个属性，当一个user的状态改变以后，利用ValueChangeEvent得到<h:selectOneMenu>的属性，从而得到userId.而第二种方法，每个单元格里有一个form表单，当一个user的状态改变以后，页面只会提交value改变的那个<h:selectOneMenu>所在的表单，再从后台bean里，利用HtmlInputHidden得到这个表单中的<h:inputHidden>中的value，即改变状态的user的id。