开发学院软件开发Java Mashups4JSF 简介:使 Mashups 更加简单 阅读

Mashups4JSF 简介:使 Mashups 更加简单

 2010-08-11 00:00:00 来源:WEB开发网   
核心提示: Places mashup 应用程序(JWL 版本)下面让我们转到 Places mashup 应用程序,在 Places 应用程序中,Mashups4JSF 简介:使 Mashups 更加简单(4),有一个主数据表、一个详细地图、一个详细天气指示器,数据表的每一行呈现一个地址,地图显示地区,并

Places mashup 应用程序(JWL 版本)

下面让我们转到 Places mashup 应用程序。在 Places 应用程序中,有一个主数据表、一个详细地图、一个详细天气指示器。数据表的每一行呈现一个地址。当应用程序用户在任何一行的 Retrieve Information 按钮上单击时,地区位置在详细地图中显示,地区天气信息在天气指示器中显示。图 2 显示了 Places 应用程序的一个屏幕截图。

图 2. Places 应用程序
Mashups4JSF 简介:使 Mashups 更加简单

查看原图(大图)

清单 6 显示了 index.jsp(Places 应用程序页面)代码中最重要的部分。单击 "cmdRetrieve"commandExButton 时,选定行(包含地区信息)通过 Ajax 协议被发送至服务器。在 bean 操作 #{place.setSelectedPlace} 中,地区信息在请求属性 "selectedPlace" 中设置,如清单 7 所示。地图和天气指示器均通过 #{selectedPlace} 表达式根据地区地址和地区邮编被更新。地图显示地区,并显示一个指向地区地址的标记及一个展示地区地址的信息窗口。天气指示器在后台对 Yahoo! Weather REST API 进行远程调用之后显示地区天气信息。

清单 6. Places 应用程序 JSP 页面(index.jsp)

<h:dataTable value="#{places.data}" 
       var="place" 
       ...> 
       <!--Columns Here--> 
   
       <h:column> 
       <f:facet name="header"> 
         <h:outputText value="Action" /> 
       </f:facet> 
  
      <hx:commandExButton id="cmdRetrieve" 
                value="Retrieve Information" 
                action="#{place.setSelectedPlace}"> 
                <hx:behavior event="onclick" id="behavior1" 
                       behaviorAction="get" 
                       targetAction="placeInformation"> 
                </hx:behavior> 
      </hx:commandExButton> 
  
       </h:column> 
</h:dataTable> 
 
 
<h:panelGrid columns="2" id="placeInformation"> 
       <h:panelGroup id="placeMap"> 
         <m:map width="400px" height="300px" 
            renderOnWindowLoad="false" 
            rendered="#{selectedPlace ne null}" 
            address="#{selectedPlace.longAddressName}" 
            zoom="9"> 
            <m:marker/> 
            <m:htmlInformationWindow 
                htmlText="#{selectedPlace.longAddressName}"/> 
         </m:map> 
       </h:panelGroup> 
   
       <h:panelGroup id="placeWeather"> 
         <mashup:yahooWeather locationCode="#{selectedPlace.postalCode}" 
                   rendered="#{selectedPlace ne null}" 
                   temperatureType="c"/> 
       </h:panelGroup> 
</h:panelGrid> 
<hx:ajaxRefreshSubmit target="placeInformation" id="ajaxRefreshSubmit1"/> 
 

上一页  1 2 3 4 5 6  下一页

Tags:MashupsJSF 简介 Mashups

编辑录入:爽爽 [复制链接] [打 印]
[]
  • 好
  • 好的评价 如果觉得好,就请您
      0%(0)
  • 差
  • 差的评价 如果觉得差,就请您
      0%(0)
赞助商链接