练习 1.5:添加用来搜索“拍卖”站点列表和提供列表详细信息的 portlet

在开始之前,必须先完成练习 1.4:创建用于创建和更新用户信息的页面

在此练习中,通过使用“单击激活操作”机制来将数据从源 portlet 发送至目标 portlet,您将创建更多提供协作行为的 portlet。源 portlet(ListingSearch)使用会话 bean 来访问拍卖商品数据。在使用 ListingSearch portlet 找到特定列表之后,目标 ListingDetail portlet 将显示有关通过搜索找到的商品的详细信息。在每种情况下,都必须首先创建 portlet。

创建 ListingSearch portlet

要创建 ListingSearch portlet,遵循下列步骤:

  1. 在“项目资源管理器”中,展开“动态 Web 项目”文件夹,并找到 AuctionPortlet 项目文件夹。右键单击该项目文件夹,并选择新建 > Portlet
  2. 在“新建 Portlet”向导的初始页面中,将缺省名称前缀更改为 ListingSearch
  3. 选择 Faces portlet 单选按钮。
  4. 单击下一步
  5. 应用程序名称下拉列表中选择 AuctionPortlet 应用程序
  6. Portlet 标题字段中输入列表搜索
  7. 单击完成

ListingSearchView.jsp 将在编辑窗格中打开。

将数据表添加至 ListingSearch portlet 页面

在 Page Designer 中打开 ListingSearchView.jsp 文件之后,遵循下列步骤来将会话 bean 数据添加为 ListingSearch 页面的数据源:

  1. 删除缺省文本将内容放在此处
  2. EJB 会话 bean 对象从选用板的数据抽屉拖动至该文件。
  3. 当“会话 Bean”向导打开时,单击新建 EJB 引用按钮。
  4. 展开 AuctionPortletEAR 和 AuctionEJB50 文件夹,选择 ListingFacade 以创建企业 bean 引用。单击完成
  5. 单击“会话 Bean”向导中的下一步
  6. 选择 ????????findByTitle(字符串标题)接口(它将用于 portlet 页面上的输入字段),并单击下一步
  7. 注意,已经选择了标题字段。单击选项
  8. 标签字段中输入查找。单击确定
  9. 单击下一步,您应进入该向导的“结果表单”页面。在此页面中,您将定义一个数据表,该数据表将检索和显示数据库中的数据。
  10. 单击以取消选择所有列,以便您可以单独选择、组织和配置该数据表中要用于 portlet 页面的适当列。然后,选择下列各列的复选框:
  11. 使用向上向下箭头按钮移动所选数据列,使其顺序与上一步中显示的顺序一致。
  12. 选择“商品标识”列的标签值,并将它更改为商品标识
  13. 单击完成以便为 UserAdminView.jsp 页面生成缺省用户界面。该用户界面看起来将类似于以下内容:
    ListingSearchView.jsp
  14. 保存该文件。

向 UserAdmin 页面添加 Java 页面代码

在此部分练习中,将添加 Java 页面代码以完成下列任务:

  • title 参数存储在会话作用域中,以便将来可以重用它来刷新 portlet 内容。
  • 使用存储在会话作用域中的参数来初始化要显示在标题输入字段中的参数。
  • 使用存储在会话作用域中的 title 参数来初始化结果数据。
  • 可以使用下列步骤来添加 EJB 引用逻辑和代码,以便将调用和结果绑定至用户界面:

    1. 从 Page Designer 的弹出菜单中选择编辑页面代码
    2. 将以下粗体代码输入 doListingFacadeLocalFindByTitleAction() 中:
      public String doListingFacadeLocalFindByTitleAction() {
          String title = getListingFacadeLocalFindByTitleParamBean().getTitle();
          getSessionScope().put("title", title);
      try {
              listingFacadeLocalFindByTitleResultBean = 
              	getListingFacadeLocal().findByTitle(title);
           } catch (Exception e) {
               logException(e);
          }
          return null;
      }
      
    3. 将以下粗体代码输入 getListingFacadeLocalFindByTitleParamBean() 中:
      public ListingFacadeLocalFindByTitleParamBean 
      	getListingFacadeLocalFindByTitleParamBean() {
          if (listingFacadeLocalFindByTitleParamBean == null) {
              listingFacadeLocalFindByTitleParamBean = 
              	new ListingFacadeLocalFindByTitleParamBean();
              String title = (String)getSessionScope().get("title");
              listingFacadeLocalFindByTitleParamBean.setTitle(title);
          }
          return listingFacadeLocalFindByTitleParamBean;
      }
      
    4. 将以下粗体代码输入 getListingFacadeLocalFindByTitleResultBean() 中:
      public ItemData[] getListingFacadeLocalFindByTitleResultBean() {
          if (listingFacadeLocalFindByTitleResultBean == null) {
              String title = (String)getSessionScope().get("title");
              if (title != null) {
      try {
                      listingFacadeLocalFindByTitleResultBean = 		
                           getListingFacadeLocal().findByTitle(title);
           } catch (Exception e) {
               logException(e);
                  }
              }
          }
          return listingFacadeLocalFindByTitleResultBean;
      }
      
    5. 保存 ListingSearchView.java。

    创建 ListingDetail portlet

    要创建 ListingDetail portlet,遵循下列步骤:

    1. 在“项目资源管理器”中,展开“动态 Web 项目”文件夹,并找到 AuctionPortlet 项目文件夹。右键单击该项目文件夹,并选择新建 > Portlet
    2. 在“新建 Portlet”向导的初始页面中,将缺省名称前缀更改为 ListingDetail
    3. 选择 Faces portlet 单选按钮。
    4. 单击下一步
    5. 应用程序名称下拉列表中选择 AuctionPortlet 应用程序
    6. Portlet 标题字段中输入列表详细信息
    7. 单击完成

    ListingDetailView.jsp 文件将在编辑窗格中打开。

    将数据表单添加至 ListingDetail portlet 页面

    在 Page Designer 中打开了 ListingDetailView.jsp 文件之后,遵循下列步骤来将会话 bean 数据添加为 ListingDetail 页面的数据源:

    1. 删除缺省文本将内容放在此处
    2. EJB 会话 bean 对象从选用板的数据抽屉拖动至该文件。
    3. 当“会话 Bean”向导打开时,选择 ejb/ListingFacade 并单击下一步
    4. 选择 findById(Integer itemid) 接口,它将用于 portlet 页面上的输入字段。
    5. 单击下一步
    6. 注意,已经选择了“商品标识”字段。选择“商品标识”字段的标签值,并将它更改为商品标识:
    7. 单击选项
    8. 标签字段中输入查找。单击确定
    9. 单击下一步,您应进入该向导的“结果表单”页面。在此页面中,您将定义一个数据表单,该数据表单将检索和显示数据库中的数据。
    10. 单击以取消选择所有字段,以便您可以单独选择、组织和配置该数据表中要用于 portlet 页面的适当字段。然后,选择下列字段的复选框:
    11. 使用向上向下箭头按钮移动所选数据字段,使其顺序与上一步中显示的顺序一致。
    12. 单击完成以便为 ListingDetailView.jsp 页面生成用户界面。该用户界面看起来将类似于以下内容:
      ListingDetailView.jsp
    13. 保存该文件。

    向 UserAdmin 页面添加 Java 页面代码

    在此部分练习中,将添加 Java 页面代码以完成下列任务:

  • itemid 参数存储在会话作用域中,以便将来可以重用它来刷新 portlet 内容。
  • 使用存储在会话作用域中的参数来初始化要显示在商品标识输入字段中的参数。
  • 使用存储在会话作用域中的 itemid 参数来初始化结果数据。
  • 可以使用下列步骤来添加 EJB 引用逻辑和代码,以便将调用和结果绑定至用户界面:

    1. 从 Page Designer 的弹出菜单中选择编辑页面代码
    2. 将以下粗体代码输入 doListingFacadeLocalFindByIdAction() 中:
      public String doListingFacadeLocalFindByIdAction() {
          Integer itemid = getListingFacadeLocalFindByIdParamBean().getItemid();
          getSessionScope().put("itemid", itemid);
      try {
                      listingFacadeLocalFindByIdResultBean = 
              	getListingFacadeLocal().findById(itemid);
           } catch (Exception e) {
               logException(e);
          }
          return null;
      }
      
    3. 将以下粗体代码输入 getListingFacadeLocalFindByIdParamBean() 中:
      public ListingFacadeLocalFindByIdParamBean 
      	getListingFacadeLocalFindByIdParamBean() {
          if (listingFacadeLocalFindByIdParamBean == null) {
              listingFacadeLocalFindByIdParamBean = 
              	new ListingFacadeLocalFindByIdParamBean();
              Integer itemid = (Integer)getSessionScope().get("itemid");
              listingFacadeLocalFindByIdParamBean.setItemid(itemid);
          }
          return listingFacadeLocalFindByIdParamBean;
      }
      
    4. 将以下粗体代码输入 getListingFacadeLocalFindByIdResultBean() 中:
      public ItemData getListingFacadeLocalFindByIdResultBean() {
          if (listingFacadeLocalFindByIdResultBean == null) {
              Integer itemid = (Integer)getSessionScope().get("itemid");
              if (itemid != null) {
      try {
                      listingFacadeLocalFindByIdResultBean = 
                           getListingFacadeLocal().findById(itemid);
           } catch (Exception e) {
               logException(e);
                  }
              }
          }
          return listingFacadeLocalFindByIdResultBean;
      }
      
    5. 保存 ListingDetailView.java。

    将协作链接添加至 ListingSearch portlet

    协作 portlet 这一术语指的是页面上各个 portlet 通过共享信息来互相交互的能力。门户网站页面上的一个或多个协作 portlet 可以自动对由源 portlet 中操作或事件所触发的源 portlet 中更改作出反应。作为事件目标的 Portlet 可以作出反应,这样将不需要用户在该页面上的其它 portlet 中进行重复更改或操作。用来实现协作行为的机制称为“单击激活操作”事件

    可以从源 portlet 上的图标启动“单击激活操作”事件。该图标表示包含一列操作目标的弹出菜单。在用户选择一个特定目标之后,属性代理程序将用相应的 portlet 操作将数据传递至目标。使用“单击激活操作”传递方法,用户只需进行单击就可以将数据从源 portlet 传送至一个或多个目标 portlet,从而导致目标对该操作作出反应并显示带有结果的新视图。

    执行下列步骤来设置 ListingSearch 与 ListingDetail 这两个 portlet 之间的协作行为:

    1. 在 Page Designer 中打开 ListingSearchView.jsp。(在“项目资源管理器”中,展开 AuctionPortlet 和 WebContent 文件夹,然后双击该文件。)
    2. “单击激活操作”输出属性对象从 Portlet 选用板抽屉拖放到标签为 {itemid} 的数据表中的输出字段上。

      注意:务必将“单击激活操作”输出属性对象放在输出字段上面,既不要放在该字段前面,也不要放在它后面。输出字段应该在一个矩形框中突出显示,并且看起来类似于以下内容:
      将“输出属性”放在输出字段上
      (可能需要将对话框移到旁边,以便查看输出字段选择。)

    3. 插入“单击激活操作”输出属性对话框中提供下列值: 保存该文件。
    4. 要验证已经添加了正确的“单击激活操作”代码,打开“源代码”视图,确保该文件中包含以下代码:
      <h:outputText id="text3"
      	value="#{varlistingFacadeLocalFindByTitleResultBean.itemid}"
      	styleClass="outputText">
      	<f:convertNumber />
      </h:outputText>
      	<c2a:encodeProperty type="itemid" 
      		namespace="http://auctionportlet" name="itemid"
      		value="#{varlistingFacadeLocalFindByTitleResultBean.itemid}">
      	</c2a:encodeProperty>
      
      记下突出显示的 value 属性。如果尚未正确地将“输出属性”添加至页面,则此属性将丢失。

    这些步骤将 ListingSearch 标识为源 portlet。接下来,必须将 ListingDetail 作为目标 portlet 来启用:

    1. 在“项目资源管理器”中展开“AuctionPortlet”>“Portlet 部署描述符”。从 ListingDetail portlet 的弹出菜单中选择协作 > 启用目标
    2. 启用协作 portlet 对话框中,在数据类型字段中输入商品标识
    3. 单击操作字段旁边的浏览按钮,并选择 /ListingDetailView.jsp > form1 > button1。单击确定
    4. 启用协作 portlet 对话框中,在标签字段中输入显示详细信息。单击确定

    要验证已经正确标识了“单击激活操作”源,返回至“项目资源管理器”中的“Portlet 部署描述符”文件夹。用来表示源 portlet(ListingSearch)和目标 portlet(ListingDetails)的图标看起来应该为如下所示:
    单击激活操作 portlet

    测试“列表 portlet”中的协作行为

    要验证 ListingSearch 和 ListingDetail portlet 在按预期工作,就应该在测试环境中运行它们。

    要运行这些 portlet,执行下列步骤:

    1. 在“项目资源管理器”中选择 AuctionPortlet 项目,并从弹出菜单中选择运行 > 在服务器上运行
    2. 因为您已经定义了 WebSphere Portal V5.1 测试环境,所以选择它并单击“选择服务器”向导中的完成
    3. 这些 portlet 将显示在浏览器中。在此处,您可以看到用户在门户网站站点上会看到的输入字段、按钮和布局。
    4. 在 ListingSearch portlet 中,输入搜索通配符 % 来列示所有商品,并单击查找按钮。提交按钮下方的表将显示符合搜索字符串的拍卖商品。
    5. 单击商品标识列中的“单击激活操作”图标 “单击激活操作”图标 以将列表标识发送至 ListingDetail portlet。ListingDetail portlet 将显示有关通过搜索找到的商品的详细信息。

    在进行下一个练习之前,应停止测试环境服务器。要停止测试环境服务器,只需在“服务器”视图中选择它,然后单击停止服务器工具栏按钮 停止服务器

    现在,您可以开始进行练习 2.1:创建新的门户网站以显示 portlet 应用程序了。

    使用条款 | 反馈
    (C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.