All +
All -
editing
- + -本章阅读说明
- 1，第一步、第二步的内容适合于那些没有读过该案例之前的章节读者，建议其他读者直接从第三步开始阅读
- 2，这里的读书记录，偏重于该案例在书中想要说明的知识点，而不是把前面章节没有涉及的内容都作为新知识点
- 3，建议阅读者，能够对照第四步中的内容，写出该案例的功能设计说明书
- 4，建议阅读者，能够对照第五步中的内容，写出该案例的功能实现方案
- 5，建议阅读者，能够动手在NetBeans 7.2（或其他IDE）中将该案例从头做一遍
- 6，本人在读书时，使用了思维导图（FreeMind）工具，如果有阅读者需要原型文档的，可qq联系：1028637037
- 7，该书是由美国 David Geary 和 Cay Horstmann 合著，由王超翻译，由《清华大学出版社》出版。如果您需要下载案例，可到出版社网址去。
- 第一步：创建案例
- 使用随书源码在NetBeans中创建项目
- 第二步：运行案例
- 一，在IDE中运行该案例
- *启动首页面index.xhtml
- 一，在IDE中运行该案例
- 第三步：阅读案例结构
- web
- 1，页面文件
- index.xhtml
- 2，资源文件
- 无
- 3，WEB-INF
- 应用程序配置文件：web.xml
- CDI配置文件：beans.xml
- JSF配置文件：faces-config.xml
- 1，页面文件
- 源包src
- com.corejsf
- 类：Name.java
- 类：TableData.java
- 消息包：messages.properties
- com.corejsf
- 库
- JDK 1.7
- GlassFish Server 3.1.2
- web
- 第四步：阅读案例新功能
- 第一层面：视图
- 页面文件
- 首页：index.xhtml
- 1，从运行结果看新内容
- *窗口标题显示内容：Editing Table Cells
- 编辑表单元格
- *页面主体内容
- 一个数据表格（3列）
- 3个列头
- 文本分别为：Edit 、Last Name、First Name
- 字体风格：黑体
- 4行数据表内容
- 每行分为3列
- 第1列是“单个复选框”
- 第2、3列是“显示文本”
- 每行分为3列
- 3个列头
- 1个按钮
- 显示文本：Save Changes
- 是个提交按钮
- 显示文本：Save Changes
- 一个数据表格（3列）
- *窗口标题显示内容：Editing Table Cells
- 2，从页面文件index.xhtml看（新内容）
- *1个“数据表”组件
- 标签：h:dataTable
- 特性
- *迭代的数据由特性value指定：value="#{tableData.names}"
- *迭代数据中的每个项由特性var指定：var="name"
- 子组件
- 1，第1列
- *列标签：h:column
- *嵌套子组件
- 一个“面”组件
- 标签：f:facet
- 属性
- 名称属性：name="header"
- 嵌套子组件
- *“输出文本”组件
- 标签：h:outputText
- 为输出文本组件
- 属性
- value='#{msgs.editColumn}'
- 为指定输出文本的内容
- style="font-weight: bold"
- 为指定输出文本的风格
- value='#{msgs.editColumn}'
- 标签：h:outputText
- *“单个复选框”组件
- 标签：h:selectBooleanCheckbox
- 属性
- value
- 用来指定组件的boolean值
- 默认值为：false
- onclick
- 用来指定单击组件时执行的js代码
- 这里是js的submit()
- 用来指定单击组件时执行的js代码
- value
- *“输出文本”组件
- 一个“面”组件
- 2，第2列
- *列标签：h:column
- *嵌套子组件
- 一个“面”组件
- 标签：f:facet
- 属性
- 名称属性：name="header"
- 嵌套子组件
- *“输出文本”组件
- 标签：h:outputText
- 为输出文本组件
- 属性
- value='#{msgs.editColumn}'
- 为指定输出文本的内容
- style="font-weight: bold"
- 为指定输出文本的风格
- value='#{msgs.editColumn}'
- 标签：h:outputText
- *“单个复选框”组件
- 标签：h:selectBooleanCheckbox
- 属性
- value
- 用来指定组件的boolean值
- 默认值为：false
- onclick
- 用来指定单击组件时执行的js代码
- 这里是js的submit()
- 用来指定单击组件时执行的js代码
- value
- *“输出文本”组件
- 标签：h:outputText
- 属性
- value
- 用来指定组件的值
- rendered
- 用来指定组件显示与否
- 默认为true
- value
- *“输入文本”组件
- 标签：h:inputText
- 属性
- value
- 用来指定组件的值
- rendered
- 用来指定组件显示与否
- 默认为true
- value
- *“输出文本”组件
- 一个“面”组件
- 3，第3列
- *列标签：h:column
- *嵌套子组件
- 一个“面”组件
- 标签：f:facet
- 属性
- 名称属性：name="header"
- 嵌套子组件
- *“输出文本”组件
- 标签：h:outputText
- 为输出文本组件
- 属性
- value='#{msgs.editColumn}'
- 为指定输出文本的内容
- style="font-weight: bold"
- 为指定输出文本的风格
- value='#{msgs.editColumn}'
- 标签：h:outputText
- *“单个复选框”组件
- 标签：h:selectBooleanCheckbox
- 属性
- value
- 用来指定组件的boolean值
- 默认值为：false
- onclick
- 用来指定单击组件时执行的js代码
- 这里是js的submit()
- 用来指定单击组件时执行的js代码
- value
- *“输出文本”组件
- 标签：h:outputText
- 属性
- value
- 用来指定组件的值
- rendered
- 用来指定组件显示与否
- 默认为true
- value
- *“输入文本”组件
- 标签：h:inputText
- 属性
- value
- 用来指定组件的值
- rendered
- 用来指定组件显示与否
- 默认为true
- value
- *“输出文本”组件
- 一个“面”组件
- 1，第1列
- *一个“按钮”组件
- 标签：h:commandButton
- 称为“命令按钮”
- 特性
- vlaue
- 用来指定组件的值（即显示文本）
- action
- 用来指定激活该组件时所调用的表达式
- 该表达式必须是一个求值的、无参数的公有方法
- 该方法返回值必须是一个String类型
- 该返回值作为应用程序的导航字符串之用
- vlaue
- 说明
- 该组件处在“表单”内部，在“数据表”之后
- 作用是提交表单
- 标签：h:commandButton
- *1个“数据表”组件
- 1，从运行结果看新内容
- 首页：index.xhtml
- 页面文件
- 第二层面：控制
- 页面控制器
- TableData
- *对应页面JSF HTML组件的属性
- 1，names:Name[]
- *对应页面JSF HTML组件的方法
- 1，对应于上述属性的读方法getNames():Name[]
- *对应页面JSF HTML组件的属性
- TableData
- 数据控制器
- TableData
- 页面控制器
- 第三层面：模型
- 对象模型
- Name
- *对象属性
- 1，first:String
- 2，last:String
- 3，editable:boolean
- *对象行为
- 1，对应上述属性的读写方法
- *对象属性
- Name
- 对象模型
- 第四层面：配置
- 无新内容
- 新功能重点总结
- *在数据表的姓名列前，增加了一列。
- 该列的“列头”文本为：Edit
- 该列在每行中列出了“复选框”组件
- 该复选框默认值为false，即显示为未选状态
- *在名字列中放置了两个组件h:outputText和inputText
- 当处于未选择状态时，该行的名字列就显示为不可编辑的输出文本组件
- 当处于选择状态时，该行的名字列就改为“可编辑”的输入文本组件
- *在数据表后增加了提交按钮，以便进行程序导航
- *在数据表的姓名列前，增加了一列。
- 第一层面：视图
- 第五步：详解新技术(可编辑单元格)的应用
- 第一层面：视图
- 视图文件
- index.xhtml
- *为了选择每行单元格的可编辑性
- 1，在名字前添加了一个列
- 2，列中嵌套一个复选框组件
- *为了使名字列具备可编辑和不可编辑两个状态
- 1，用输出文本组件来表现不可编辑状态时之用
- 2，用输入文本组件来提供可编辑状态时之用
- *为了使名字的可编辑状态能够按行选择，并立即改变
- 1，设置复选框组件上的onclick特性的值为submit()
- 就是说，当单击复选框时，可以立即提交表单
- 1，设置复选框组件上的onclick特性的值为submit()
- *为了选择每行单元格的可编辑性
- index.xhtml
- 视图资源
- resources
- css
- styles.css
- css
- resources
- 视图文件
- 第二层面：控制
- 页面控制器
- TableData
- *在index.xhtml页面中使用
-
对象名称为：tableData
对象的方法getNames()返回值，作为“数据表”组件的特性value的值：
value="#{tableData.names}"
对象的方法save()，把各个名字的可编辑状态均设置为不可编辑
-
- *在index.xhtml页面中使用
- TableData
- 数据控制器
- TableData
-
通过方法getNames()操作（获取）对象模型Name的对象数组:
public Name[] getNames() {
return names;
}
通过方法save()操作对象模型Name的可编辑状态：
public String save() {
for (Name name : names) {
name.setEditable(false);
}
return null;
}
-
- TableData
- 页面控制器
- 第三层面：模型
- 对象模型
- Name
- *属性
- first:String
- last:String
- editable:boolean
- 为了读写名字的可编辑状态
- *方法
-
属性对应的读写方法
构造方法，具有上述两个属性对应的参数：
public Name(String first, String last) {
this.first = first;
this.last = last;
}
-
- *属性
- Name
- 对象模型
- + -第四层面：配置
- 无新内容
- + -第五层面：国际化
- 英文消息文件
- com.corejsf.messages.properties
- 注意：这里不讨论太多国际化问题，它超出了该案例的主要问题
- 英文消息文件
- 第一层面：视图
1037
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
