jsf表格panelGrid【DOC精选】.doc

jsf表格h:panelGrid 属性详解 2009-04-11 14:49 一.页面布局:h:panelGrid 样式表基本概念:单元格样式: columnClasses=columnClasses1, columnClass2,... == td class=columnClasses1....td class=columnClasses2行样式: rowClasses=rowClasses1, rowClasses2 == tr class=rowClasses1....tr class=rowClasses2样式: styleClass= == table class=注: 无法实现多个表头单元.panelGrid 标签学习 这个标签可以用来作简单的组件排版，它会使用HTML表格标签来绘制表格，并将组件置于其中，主要指定columns属性，例如设定为 2： h:panelGrid columns=2 h:outputText value=Username/ h:inputText id=name value=#{userB}/ h:outputText value=Password/ h:inputText id=password value=#{userBean.password}/ h:commandButton value=submit action=login/ h:commandButton value=reset type=reset/ /h:panelGrid 则自动将组件分作 2 个 column来排列，排列出来的样子如下： h:panelGrid的本体间只能包括JSF组件，如果想要放入非JSF组件，例如简单的样版（template）文字，则要使用 f:verbatim包括住，例如： h:panelGrid columns=2 f:verbatimUsername/f:verbatim h:inputText id=name value=#{userB}/ f:verbatimPassword/f:verbatim h:inputText id=password value=#{userBean.password}/ h:commandButton value=submit action=login/ h:commandButton value=reset type=reset/ /h:panelGrid h:panelGroup 这个组件用来将数个JSF组件包装起来，使其看来像是一个组件，例如： h:panelGrid columns=2 h:outputText value=Username/ h:inputText id=name value=#{userB}/ h:outputText value=Password/ h:inputText id=password value=#{userBean.password}/ h:panelGroup h:commandButton value=submit action=login/ h:commandButton value=reset type=reset/ /h:panelGroup /h:panelGrid 在h:panelGroup中包括了两个h:commandButton，这使得 h:panelGrid在处理时，将那两个h:commandButton看作是一个组件来看待，其完成的版面配置如下所示： 下面转载与/liyong1115/archive/2008/02/27/2125029.aspx 一、初识panelGrid和与之相关的设计元素 　　panelGrid相当于HTML的表格，在设计中与之相关的组件有panelGrop，与之相配合的CSS 设计元素有styleClass、headerClass、footerClass、rowClasses、columnClasses。这些元 素的有机组合，可以设计出不同的输出画面。 　　在HTML网页设计中，表格有tabletrtd等标记符号，也可以在标记符号内嵌入CSS控 制语句来控制输出的表现形式。JSF中的panelGrid虽然与HTML表格相对应，但是二者在设计时 还是有很大差异的。例如我们假设有一个HTML的表如下： table tr td.../td td.../td /tr tr td.../td td.../td /tr /table 则panelGrid与之对应的标记是： h:panelGrid column=2 ...