JSF 与 HTML 标签的联系
*页面的开头
<%@ 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;" />
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="撤消审批意见" οnclick="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” οnclick=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;
}
转载于:https://www.cnblogs.com/netliang/p/4183930.html
JSF 与 HTML 标签的联系相关推荐
- jsf用于页面判断的标签_用于操作和导航的JSF命令组件标签
jsf用于页面判断的标签 JSF provides two command component tags for performing action and navigation. They are ...
- 润乾报表JSF FORM 标签中使用填报表解决方案
需求 润乾报表的标签需要在jsf页面中和其他填报控件一起使用,润乾报表负责展现录入部分数据,并且这部分数据和页面的其它控件的数据存在前台和后台的交互. 问题 润乾报表在前台会生成自己的form, ...
- jsf标签,jsp标签与jstl标签
JSF通过定制标签与JSP集成.之前展示过的所有 JSF标签,<h:inputText>.<h:outputText>.<h:form> 和<f:view&g ...
- jsf tree组件_JSF文本组件–标签,文本字段,文本区域和密码
jsf tree组件 The Text components allows the user to add, view and edit data in a form of a web applica ...
- JSF 标签大全(非常详细 有例子)
1. JSF入门 藉由以下的几个主题,可以大致了解JSF的轮廓与特性,我们来看看网页设计人员与应用程序设计人员各负责什么. 1.1简介JSF Web应用程序的开发与传统的单机程序开发在本质上存在着太多 ...
- JSF——JSF 标签
JSF 标签 网页设计人员要作的就是了解JSF的标签的使用方式,这就像是学习进阶的HTML标签,另一件事就是与程序设计人员沟通好各个Bean的名称绑定. 标签入门 卷标的相关属性查询,您可以参考 Ta ...
- JSF, MyFaces, RichFaces 和 Facelets的区别
初学JavaEE时很多东西都没理解,只是一股脑地往大脑里灌,现在是到明确一下的时候了. JSF(JavaServer Faces) JSF是一套用于构造基于组件的Web应用的界面的规范. 需要着重强调 ...
- web.xml.jsf_面向初学者的JSF 2.0教程
web.xml.jsf 1.什么是JSF? JSF是Java Server Faces的首字母缩写. 它是一种服务器端处理技术,它允许将服务器端代码嵌入到网页中. 由于可以将服务器端处理和渲染代码嵌入 ...
- jsf教程_JSF教程
jsf教程 Welcome to JSF Tutorial. Java Server Faces (JSF) technology is a front end framework which mak ...
最新文章
- Centos netperf安装
- mysql union join_MySQL 超新手入门(5) JOIN 与 UNION 查询
- 【转】SAP地产业正青春
- 迅为linux下串口,迅为IMX6ULL开发板Linux RS232/485驱动实验(上)
- loadrunner脚本设计:参数化
- 腾讯大数据高级产品总监洪桃李:决胜未来的4大关键能力
- Java中方法参数的传递
- 最高的奖励 51Nod - 1163(贪心+并查集)
- CSU 1259 bfs找最短路
- centos中mysql操作命令,Linux系统中MySQL的常用操作命令
- 大整数乘法(信息学奥赛一本通-T1174)
- ASP.NET Core Web API/MVC应用中间件中的Cookie记录
- 同步升压与异步升压_单相220V转三相380V升压变频器
- vue项目动态域名设置方法
- 站内信系统数据库设计
- stimulsoft入门教程:简单列表报表
- win10无法安装完成若要在此计算机上,win10提示windows安装无法继续怎么办
- 微信小程序 day4
- java 三边求面积_已知三角形的三边长如何求面积?
- mac linux网卡驱动下载官网下载,linux | 网卡驱动
热门文章
- mysql python 中文_python操作mysql中文显示乱码的解决方法
- python直线检测_opencv+python 开操作进行直线检测
- 鸿蒙系统手机现在有什么,华为鸿蒙手机迟迟未来 手机操作系统面临的难点有哪些...
- c创建python虚拟机_cpython大致数据结构实现笔记
- arm64 指令集_透彻解析LED驱动芯片HT1632C指令集与驱动编程
- sapi cli php mac,make: *** [sapi/cli/php] Error 1 解决办法
- 经典排序算法(Java版)
- 修改联想笔记本键盘快捷键
- 大数据学习笔记:利用JAVA项目操作HBase
- 基于注解使用MyBatis