ADF(ORACLE JEE 平台)中Table的显示detail功能的使用

ADF(ORACLE JEE 平台)中Table的显示detail功能的使用

        ADF(Application development Framework)是Oracle主推的JEE平台的解决方案，其中包括JDeveloper (开发IDE)，Weblogic(Server 容器),ADF Faces(JSF 实现)， ADF richFaces(JSF 中扩展组件)等等。
本文主要讨论ADF Faces中，如何控制显示Table的Details信息。

        ADF Table类似于JSF标准的Table,但提供许多更有用的功能。比如显示Datail就是很好的功能，如下图：用户可以点击首列小图表，查看本行详细信息
      

如下图显示：

下面是相对应的JSP和BackingBean

<! DOCTYPE HTML PUBLIC  " -//W3C//DTD HTML 4.01 Transitional//EN "
" http://www.w3.org/TR/html4/loose.dtd " >
<% @ page contentType = " text/html;charset=GBK " %>
<% @ taglib uri = " http://java.sun.com/jsf/html "  prefix = " h " %>
<% @ taglib uri = " http://java.sun.com/jsf/core "  prefix = " f " %>
<% @ taglib uri = " http://xmlns.oracle.com/adf/faces "  prefix = " af " %>
<% @ taglib uri = " http://xmlns.oracle.com/adf/faces/html "  prefix = " afh " %>
< f:view >
   < afh:html >
     < afh:head title = " tableTest " >
       < meta http - equiv = " Content-Type "  content = " text/html; charset=GBK " />
       < style type = " text/css " >
      body  {
}
      a:link  { color: #ffa5a5; }
     </ style >
     </ afh:head >
     < afh:body >
       < h:form >
         < af:table width = " 98% "  value = " #{tableTest.allData} "  var = " data "
                  emptyText = " No Data "
                  disclosureListener="#{tableTest.showDetails}"  banding = " none "
                  varStatus = " vs " >
           < af:column sortable = " true "  formatType = " icon "
                     inlineStyle = " border-color:rgb(0,0,0); border-width:thin; margin:auto; text-align:center; " >
             < f:facet name = " header " >
               < af:outputText value = " NO. " />
             </ f:facet >
             < af:outputText value = " #{data.column1} " />
           </ af:column >
           < af:column  inlineStyle = " border-color:rgb(0,0,0); border-width:thin; margin:auto; text-align:center; " >
             < f:facet name = " header " >
               < af:outputText value = " Last Name " />
             </ f:facet >
             < af:outputText value = " #{data.column2} " />
           </ af:column >
           < af:column  inlineStyle = " border-color:rgb(0,0,0); border-width:thin; margin:auto; text-align:center; " >
             < f:facet name = " header " >
               < af:outputText value = " First Name " />
             </ f:facet >
             < af:outputText value = " #{data.column3} " />
           </ af:column >
          <f:facet name="detailStamp">
            <af:panelGroup layout="vertical">
              <af:outputText rendered="#{tableTest.showDetail}"
                             value="#{data.detail}"/>
               <af:outputText rendered="#{tableTest.showDetail}"
                             value="#{data.detail}"/>
                <af:outputText rendered="#{tableTest.showDetail}"
                             value="#{data.detail}"/>
             </ af:panelGroup >
           </ f:facet >
         </ af:table >
       </ h:form >
     </ afh:body >
   </ afh:html >
</ f:view >

其中红色部分JSP就是显示Details信息。
disclosureListener="#{tableTest.showDetails}" 为Table加一个打开关闭Details信息的监听器，在监听器里面控制显示。

BackBean如下：

public   class  TableDataBackBean  {
    private List allData = new ArrayList();
    private boolean showDetail = false; 
    public TableDataBackBean() {
        TableData tableDate1 = new TableData("1","vincent","ma","vincent ma'detail");
        TableData tableDate2 = new TableData("2","barry","fan","barry fan'detail");
        TableData tableDate3 = new TableData("3","jeny","chen","jeny chen'detail");
        TableData tableDate4 = new TableData("4","ross","han","ross han'detail");
        TableData tableDate5 = new TableData("5","robin","liu","robin liu'detail");
        TableData tableDate6 = new TableData("6","walker","liu","walker liu'detail");
        allData.add(tableDate1);
        allData.add(tableDate2);
        allData.add(tableDate3);
        allData.add(tableDate4);
        allData.add(tableDate5);
        allData.add(tableDate6);

    
    }

    public void showDetails(DisclosureEvent disclosureEvent) {
        if(disclosureEvent.isExpanded()){
          this.showDetail = true;
          }
    }

    public void setAllData(List allData) {
        this.allData = allData;
    }

    public List getAllData() {
        return allData;
    }

    public void setShowDetail(boolean showDetail) {
        this.showDetail = showDetail;
    }

    public boolean isShowDetail() {
        return showDetail;
    }
}

当用户点击打开小图标时，触发如下事件：
    public void showDetails(DisclosureEvent disclosureEvent) {
        if(disclosureEvent.isExpanded()){
          this.showDetail = true;
          }
    }


那么，如何只让它显示一个Detail 信息呢？ 也就是打开第二个时，关闭第一个呢? 很简单
修改showDetails方法如下：

     public  String oldValue  =   "" ;
     public   void  showDetails(DisclosureEvent disclosureEvent)  {
        CoreTable activityTable1 = (CoreTable)disclosureEvent.getComponent();
        if(disclosureEvent.isExpanded()){
          this.showDetail = true;
          }
          
        RowKeySet rowKeySet2  = activityTable1.getDisclosureState();
          Set set =rowKeySet2.getKeySet();
          Iterator iterator = set.iterator();
          if(set.size()==2){
             while(iterator.hasNext()){
              String temp = (String)iterator.next();
                 System.out.println("Old Value:"+oldValue);
              System.out.println("Two value:"+temp);
              if(!temp.equals(oldValue)){
                  oldValue = temp;
                  System.out.println("Set　Older Value ="+temp);
                  break;
              }
             }
             set.clear();
             set.add(new String(oldValue));
             System.out.println("Display:"+oldValue);
          }else if(set.size()==1){
              while(iterator.hasNext()){
               String temp = (String)iterator.next();
                   oldValue = temp;
              }
              set.add(new String(oldValue));
              System.out.println("only One Display:"+oldValue);
          }

          
         activityTable1.setDisclosureState(rowKeySet2);
    }