開花流水

*頁面的開頭

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>

<%@ taglib uri="http://myfaces.apache.org/extensions" prefix="x"%>

<%@ taglib uri="http://jsftutorials.net/htmLib" prefix="htm"%>

<%@ taglib uri="http://www.ccb.cn/xmdc" prefix="xmdc"%>

<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>

<%@ taglib uri="http://java.sun.com/jstl/fmt" prefix="fmt"%>

<%@ taglib prefix="tiles" uri="http://struts.apache.org/tags-tiles"%>

<link rel="stylesheet" type="text/css"

       href="<%=request.getContextPath()%>/css/style_organ.css" />

<link rel="stylesheet" type="text/css"

       href="<%=request.getContextPath()%>/css/public.css" />

<link rel="stylesheet" type="text/css"

       href="<%=request.getContextPath()%>/css/ext.css" />

*假數據的構造

<%String str[] = new String[] { "項目名稱1", "項目名稱2" };

javax.faces.model.ArrayDataModel ad = new javax.faces.model.ArrayDataModel(str);

pageContext.setAttribute("ad", ad, PageContext.SESSION_SCOPE);

%>

1、inputTextarea

常用屬性：cols

          Rows

常用的寫法：

<h:inputTextarea value=”” rows=”8” style=”width:100%” />

2、inputText

   常用屬性：readonly

               Size       框的大小

               Maxlength  最多字符數

     常用的寫法：

<h:inputText value=”” size=”5” readonly=”true”

Maxlength=”6”

style=”color:yellow;background:Teal;” />

3、outputText

常用屬性：escape   如果設置為true，會轉義<、>和＆字符。默認值為false

使用舉例：

 <h:outputText value="outputtext"

         style="height:30;width:100%;text-align:center;background-color:#DDDDDD;" />

4、outputFormat

此標簽用于tag體中指定的參來格式化組合的消息，

例如：

 <h:outputFormat value=”{0} is {1} years old!” >

 <f:param value=”Bill” />

 <f:param value=”38” />

 </h:outputFormat>

5、graphicImage

      常用例子：

          <h:graphicImage value=”/tjefferson.jpg” style=”border:thin solid black” />

           <h:graphicImage value=”/tjefferson.jpg” style=”border:0px” />

      <h:graphicImage value="../../images/fadajing.gif" />

6、commandButton

     常用屬性：

         Type     

      使用舉例：

     <h:panelGrid columns="2" align="center">

            <h:commandButton value="確認" action="" styleClass="button" style="margin-right:10px"/>

            <h:commandButton value="取消" action="" styleClass="button" />

</h:panelGrid>

<h:panelGrid columns="6" align="center" cellspacing="5">

       <xmdc:outputText value="請選擇：" />

       <h:selectOneMenu>

              <f:selectItem itemValue="0" itemLabel="下一步" />

       </h:selectOneMenu>

       <h:commandButton value="提 交" action="" styleClass="button" />

       <h:commandButton value="確 認" action="" styleClass="button" />

       <h:commandButton value="取 消" action="" styleClass="button" />

       <h:commandButton value="撤消審批意見" onclick="javascript:cancelApproval()"

              action="" styleClass="button" />

</h:panelGrid>

7、commandLink

使用舉例：

   <h:commandLink>

      〈h:outputText value=”#{msgs.linkTex}” />

   </h:commandLink>

8、outputLink

使用舉例：

   <h:outputLink value=”” title=”outputLink的標題” target=”blank” >

       <h:outputText value=”” />
          </h:outputLink>

   <h:outputLink value="http://www.ccb.cn">

                         <xmdc:outputText value="額度信息" bold="true" />

</h:outputLink>

9、selectBooleanCheckbox

      復選框(單個的)

      <h:selectBooleanCheckbox value=”sdfsdf” />

10、selectManyCheckbox

一組復選框

<h:selectManyCheckbox value=”#{form.colors}” >

    <f:selectItem itemValue=”紅” />

    <f:selectItem itemValue=”藍” />

    <f:selectItem itemValue=”黃” />

    <f:selectItem itemValue=”綠” />

    <f:selectItem itemValue=”橙黃” />

</h:selectManyCheckbox>

11、selectOneRadio

       單選按鈕

<h:selectOneRadio>

         <f:selectItem itemValue="0" itemLabel="全體人員" />

         <f:selectItem itemValue="1" value="true" itemLabel="HR人員" />

</h:selectOneRadio>

12、selectOneListbox

     <h:selectOneListbox value=”#{}” size=”5” >

         <h:selectItem value=”1900” itemLabel=”1900” />

         <h:selectItem value=”1901” itemLabel=”1901” />

         <h:selectItem value=”1902” itemLabel=”1902” />

         <h:selectItem value=”1903” itemLabel=”1903” />

     </h:selectOneListbox>

13、selectManyListbox

   <h:selectManyListbox value=”#{}” size=”5” >

         <h:selectItem value=”1900” itemLabel=”1900” />

         <h:selectItem value=”1901” itemLabel=”1901” />

         <h:selectItem value=”1902” itemLabel=”1902” />

         <h:selectItem value=”1903” itemLabel=”1903” />

     </h:selectManyListbox>

14、iframe

<iframe name="main" frameborder="0" framespacing="0" scrolling="no" width="100%" src="Organview/OrganIndex.htm">

</iframe>

15、inputCalendar

<x:inputCalendar monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader"

       currentDayCellClass="currentDayCell" renderAsPopup="true" popupTodayString="Today" popupWeekString="Week" popupDateFormat="yyyyMMdd" value=""/> 

16、datatable2

<xmdc:dataTable2 value="#{ad}" var="blankstr" width="88%" columnClasses="center">

                                          <h:column>

                                                 <f:facet name="header">

                                                        <h:outputText value="姓名" />

                                                 </f:facet>

                                                 <h:outputText value="#{blankstr}" />

                                          </h:column>

                                          <h:column>

                                                 <f:facet name="header">

                                                        <h:outputText value="成績" />

                                                 </f:facet>

                                                 <h:outputText value="" />

                                          </h:column>

                                          <h:column>

                                                 <f:facet name="header">

                                                        <h:outputText value="總體成績" />

                                                 </f:facet>

                                                 <h:outputText value="" />

                                          </h:column>

                                          <h:column>

                                                 <f:facet name="header">

                                                        <h:outputText value="表現評語" />

                                                 </f:facet>

                                          </h:column>

       </xmdc:dataTable2>

17、表頭為復雜的datatable

<%//                     些處為復雜表格    %>

              <htm:table width="650" border="1" align="center">

                     <htm:tr>

                            <htm:td height="80" width="56" rowspan="2" align="center"

                                   valign="middle" bgcolor="#f3f3f3">

                                   <h:outputText value="項目" />

                            </htm:td>

                            <htm:td colspan="5" align="center" bgcolor="#f3f3f3">

                                   <h:outputText value="中長期勞動合同員工" />

                            </htm:td>

                            <htm:td rowspan="2" align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="短期勞動合同員工" />

                            </htm:td>

                            <htm:td rowspan="2" align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="勞務用工" />

                            </htm:td>

                            <htm:td rowspan="2" align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="審計系統人員" />

                            </htm:td>

                            <htm:td colspan="2" align="center" bgcolor="#f3f3f3">

                                   <h:outputText value="機構" />

                            </htm:td>

                     </htm:tr>

                     <htm:tr>

                            <htm:td align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="總計" />

                            </htm:td>

                            <htm:td align="center" bgcolor="#f3f3f3">

                                   <h:outputText value="一級分行行領導或總行本部部門領導" />

                            </htm:td>

                            <htm:td align="center" bgcolor="#f3f3f3">

                                   <h:outputText value="六、七職等管理崗位職務人員" />

                            </htm:td>

                            <htm:td align="center" bgcolor="#f3f3f3">

                                   <h:outputText value="三、四級專業技術崗位職務人員" />

                            </htm:td>

                            <htm:td align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="黨員" />

                            </htm:td>

                            <htm:td align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="總計" />

                            </htm:td>

                            <htm:td align="center" width="56" bgcolor="#f3f3f3">

                                   <h:outputText value="其中:營業機構" />

                            </htm:td>

                     </htm:tr>

              </htm:table>

<%//                     些處為復雜表格 end    %>

              <xmdc:dataTable2 value="#{ad}" var="blankstr" width="650"

                     columnClasses="center" align="center">

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

                     <h:column>

                            <h:outputText escape="false" value="#{blankstr}" />

                     </h:column>

              </xmdc:dataTable2>

18、HRDC的datatable

<h:dataTable width="95%" align="center" border="1" value="" var="" rowClasses="td01,td02,td02,td02,td02,td02">

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="" />

              </f:facet>

              <h:selectOneRadio>

              </h:selectOneRadio>

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="序號" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="客戶編號" />

              </f:facet>

              <h:inputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="合同編號" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="客戶名稱" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="合同品種" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="合同幣種" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="表內余額" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="表外余額" />

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="五級分類"></xmdc:outputText>

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="狀態"></xmdc:outputText>

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="經辦機構"></xmdc:outputText>

              </f:facet>

              <h:outputText value="" />

       </h:column>

       <h:column>

              <f:facet name="header">

                     <xmdc:outputText value="授信支用詳情"></xmdc:outputText>

              </f:facet>

              <h:outputLink value="">

                     <xmdc:outputText value="x001"></xmdc:outputText>

              </h:outputLink>

       </h:column>

</h:dataTable>

19、panelGrid

       <xmdc:panelGrid columns="4" align="center" width="100%" border="1"

              columnbgcolors="#F3F3F3,#FFFFFF,#F3F3F3,#FFFFFF"

              columnwidths="20%,30%,20%,30%"

               rowheights="22,22,22,22,22"

              columnbgcolors="#F3F3F3,#ffffff,#F3F3F3,#ffffff"

              columnaligns="left,center,right"

              columnvaligns="top,top,"

        colspan=”;2,2;2;3,1;”

              >

              <xmdc:outputText value="債項批復編號" />

              <xmdc:outputText value="" />

              <xmdc:outputText value="合同編號" />

              <xmdc:outputText value="" />

              <xmdc:outputText value="期限" />

              <xmdc:outputText value="" />

              <xmdc:outputText value="合同性質" />

              <xmdc:outputText value="" />

       </xmdc:panelGrid>

20、selectOneMenu

<h:selectOneMenu>

       <f:selectItem itemValue="0" itemLabel="新增" />

       <f:selectItem itemValue="1" itemLabel="借新還舊" />

       <f:selectItem itemValue="2" itemLabel="債務轉移(簽定新合同)" />

       <f:selectItem itemValue="3" itemLabel="整體債務轉移" />

       <f:selectItem itemValue="4" itemLabel="展期" />

       <f:selectItem itemValue="5" itemLabel="擔保變更" />

       <f:selectItem itemValue="6" itemLabel="信用證修改" />

       <f:selectItem itemValue="7" itemLabel="保函修改" />

       <f:selectItem itemValue="8" itemLabel="資產轉讓(買斷型受讓)" />

</h:selectOneMenu>

21、標簽頁面：multlink

<%//頂部標簽%>

              <xmdc:multlink value="1" paneLable="一般客戶,集團客戶"s            paneLink="CreditineLedgerInfoQuery_Gen.jsf,CreditineLedgerInfoQuery_Gen.jsf"

                     align="left" />

22、頁面彈出(按鈕)

<h:commandButton type=”button” onclick=openWindow('examine_approve/2.jsf’,

800,320,100,100)” value=”選擇下一個審批人” styleClass=”button” />

23、分頁的代碼

<xmdc:panelGrid columns="1" align="center" rendered="#{customerMagnifierBackingBean.flag}">

              <xmdc:panelGrid columns="2" align="center" columnaligns="center,center" columnvaligns="middle,middle">

                     <x:dataScroller id="scroll_1" for="userdata" fastStep="10" pageCountVar="pageCount" pageIndexVar="pageIndex" paginator="false" paginatorMaxPages="0" rowsCountVar="rowsCount" displayedRowsCountVar="displayedRowsCountVar" firstRowIndexVar="firstRowIndex"

                            lastRowIndexVar="lastRowIndex" style="display:inline" actionListener="#{customerMagnifierBackingBean.scrollerAction}">

                            <f:facet name="first">

                                   <h:outputText value="首頁" />

                            </f:facet>

                            <f:facet name="last">

                                   <h:outputText value="尾頁" />

                            </f:facet>

                            <f:facet name="previous">

                                   <h:outputText value="上一頁" />

                            </f:facet>

                            <f:facet name="next">

                                   <h:outputText value="下一頁" />

                            </f:facet>

                     </x:dataScroller>

                     <x:dataScroller id="scroll_2" for="userdata" rowsCountVar="rowsCount" displayedRowsCountVar="displayedRowsCountVar" firstRowIndexVar="firstRowIndex" lastRowIndexVar="lastRowIndex" pageCountVar="pageCount" pageIndexVar="pageIndex">

                            <h:outputFormat id="outputFormat" value="一共找到{0}條記錄，第{1}頁/共{2}頁" style="display:inline">

                                   <f:param value="#{rowsCount}" />

                                   <f:param value="#{pageIndex}" />

                                   <f:param value="#{pageCount}" />

                            </h:outputFormat>

                     </x:dataScroller>

              </xmdc:panelGrid>

       </xmdc:panelGrid>

24、上傳下載

文檔上傳必須統一使用myfaces控件，不得使用其他上傳方法。

界面：

<x:inputFileUpload value="#{creditLimitApplicationSchemeBackingBean.myFile}" storage="file" required="true"></x:inputFileUpload>

Backingbean：

InputStream inputStream = new BufferedInputStream(myFile.getInputStream());

下載必須采用Basebackingbean的downLoadFile方法：

/**

   * 文件下載

   * @param object FileInputStream或ByteArrayOutputStream

   * @param FileName 文件名

   * @param contenttype 下載類型

   */

  public void downLoadFile(Object object,String fileName,String contenttype)

界面主要是一個動作對應后臺一個方法

Backingbean調用如下方法：

例如：

        public String downloadExcel()

        {

                 String contentType = "application/vnd.ms-excel";

                // 獲得Excel文件流(可能是輸出流，也可能是輸入流)

                object = IBizApplicationUCC.downloadExcel(bizId)

                // 生成默認文件名

               defaultFileName = 文檔類型代碼.業務申報書 + BriefBizTaskVO.bizEventNumber

                //彈出窗口給界面下載

                downLoadFile(Object object,String defaultFileName ,String contenttype)

                return null;

        }