Use JDeveloper 11g to Create a Data Control From a Web Service

Purpose

In this tutorial, you learn how to use a web service as a data control and to create a JSF page exposing methods defined in the web service. The tutorial uses a web service that is stored on a public server.

Time to Complete

25 minutes

Topics

The tutorial covers the following sections:

	Overview
	Scenario
	Prerequisites
	Create a Data Control from a Web Service Definition
	Create a JSF Page Using the Data Control
	Run the Page
	Summary

Viewing Screenshots

Place the cursor over this icon to load and view all the screenshots for this tutorial. (Caution: This action loads all screenshots simultaneously, so response time may be slow depending on your Internet connection.)

Note: Alternatively, you can place the cursor over an individual icon in the following steps to load and view only the screenshot associated with that step. You can hide an individual screenshot by clicking it.

Overview

After having configured JDeveloper to access the web service outside a possible firewall, you create a data control based on a web service. Then, you create a JSF page using the data control that was created from the web service.

Back to Topic List

Scenario

From a publicly accessible server containing a web service definition that returns weather information, you create a data control based on this web service and pick one of the available operations (GetWeatherByZipCode). Then you create a JSF Page using a template available in JDeveloper and use the data control in your page. Finally, you run the page and test it by providing a zip code value.

Back to Topic List

Prerequisites

Before starting this tutorial, you should:

	Download the Required Components and Start JDeveloper 11g
	Examine the Web Service Definition
	Create a New Application

Back to Topic List

Download the Required Components and Start JDeveloper 11g

In the following steps, you download JDeveloper 11g and other files required for this tutorial.

Back to Topic

Back to Topic List

Examining the Web Service Definition

Before using the web service as a data control, you review its contents. To do this, perform the following steps:

1.	Locate the directory where you just downloaded the WeatherForecast.asmx file, then right click and from context select Open With --> Notepad.
2.	In the Notepad editor, examine the contents of the file. At the bottom of the file you'll find the web service name WeatherForecast.
3.	The binding name for the service is WeatherForecastSoap and it has two operations GetWeatherByZipCode and GetWeatherByPlaceName.
4.	Locate the description of the operation element GetWeatherByZipCode. .
5.	Examine the group of variables returned by the operation (WeatherForecast and WeatherData). See the name of the WeatherData variables. These variables will be used later on in the tutorial as well as the GetWeatherByZipCode operation. Close the Notepad window

Back to Topic

Back to Topic List

Creating a New Application

If you are working behind a firewall, you need to set the Web Proxy parameter to be able to access the external server holding the web service. You can then create a new application. To do this, perform the following steps:

1.	To set the Web Proxy parameters, from the main menu select Tools | Preferences ...
2.	To go through the firewall, in the Preferences window, select Web Browser and Proxy in the left pane navigator. Click the Use HTTP Proxy Server checkbox and enter the host name of your proxy server: Host Name (e.g.) my-proxy.mydomain.com Port Number 80 Exceptions localhost|127.0.0.1 Click OK.
3.	In the Application Navigator, Click New Application.
4.	In the Create Application dialog, enter the application name WSDC_App, and select Fusion Web Application (ADF) from the Application Template proposal. Click Finish.
5.	The Application Navigator should look like this:
6.	Click Save All icon on the JDeveloper menu bar, or select File | Save All.

Back to Topic

Back to Topic List

Creating a Data Control from a Web Service Definition

To create the data control from a web service definition, perform the following steps:

1.	In the Application Navigator, right click the Model project and select New from context.
2.	In the New Gallery, select the All Technologies tab, then in the Business Tier | Web Services category double click the Web Service Data Control item to launch the Create Web Service Data Control wizard.
3.	In the Create Web Service Data Control dialog, enter the following values: Name weather URL http://www.webservicex.net/WeatherForecast.asmx?WSDL Click the <Tab> key, and JDeveloper connects to the server to find the WSDL document.
4.	Once the document is found on the server, the Service information is provided. Click Next.
5.	In the list of the available operations, select GetWeatherByZipCode and click the Add button to shuttle it to the Selected list. Then click Next.
6.	Click Next until you reach the Finish step of the wizard. Review the description of the data control. Then click Finish.
7.	The Application Navigator should now look like this:
8.	Open the Data Control accordion and expand the GetWeatherByZipCode | Parameters nodes. Notice the expected Zip Code parameter for the GetWeatherByZipCode(String) method.
9.	Click Save All icon on the JDeveloper menu bar, or select File | Save All.

Back to Topic List

Creating a JSF Page Using the Data Control

In the following steps you create a JSF Page that uses the data control created from the web service.

1.	In the Application Navigator, collapse the Model project node, then right click the ViewController and select New from context.
2.	In the New gallery, select Web Tier | JSF category and select JSF Page from the item list. Click OK.
3.	In the Create JSF Page dialog, enter WeatherReport as the file name. For the Use Page Template field, select /oracle/templates/threeColumnTemplate.jspx from the list, and check the Create as XML Document (*.jspx). Then click OK.
4.	A new page opens up in the editor, displaying the content of the template page.
5.	Right click within the right most column (end one) and select Delete from context.
6.	Open the Data Controls accordion, select weather | GetWeatherByZipCode(String) operation and drag and drop it onto the start column. From context, select Parameters --> ADF Parameter Form...
7.	In the Edit Form Fields dialog, click OK to accept default values. In the Edit Action Binding dialog, click OK to accept default values.
8.	In the Structure pane, select the inputText component and in the Property window, type Enter Zip Code to replace the existing label.
9.	From the Data Controls pane, expand the weather | GetWeatherByZipCode | Return | GetWeatherByZipCodeResult | Details nodes and drag and drop WeatherData onto the center facet. From context select Table --> ADF Read-only Table...
10.	In the Edit Table Columns dialog, check the Sorting checkbox. Then click OK.
11.	The page design should look like this:
12.	Because the WeatherImage field is an image and not an outputText field as generated by default, you need to convert it. Right click one of the cells of the WeatherImage column and select Convert from context. In the Convert dialog, select Image and click OK. In the Confirm Convert dialog, click OK.
13.	For the new Image component, in the Property pane select the Source field and choose Expression Builder from the list.
14.	In the Expression Builder dialog, expand the JSP Objects | Row nodes and select WeatherImage to make it the expression. Click OK.
15.	Click Save All icon on the JDeveloper menu bar, or select File | Save All.

Back to Topic List

Running the Page

To run the WeatherReport page, perform the following steps:

1.	Before running the page, you set a property so that when launching the application, you prevent calling the web service before having provided a zip code. Back in the editor for the WeatherReport page, click the Bindings tab and then in the Executables box, select GetWeatherByZipCodeIterator.
2.	In the Property Inspector, in the Advanced section, for the GetWeatherByZipCodeIterator, click the RefreshCondition field and select Edit from the list.
3.	In the Edit Property dialog, expand JSF Managed Beans | adfFacesContext and select initialRender. Click OK.
4.	Click the Design tab of the editor to switch back to the Design view, then right click within the page and select Run from context.
5.	The page gets loaded into your Browser window. Note that this operation may take some time before the page appears since you are accessing a remote server.
6.	In the Zip Code field, enter a valid US zip code. (e.g. 94065).
7.	On the error window click OK.
8.	The page displays the coming days' forecast for the zip code specified.
9.	Experiment resizing columns and sorting in ascending or descending order on the column of your choice.
10.	Try any new zip code you wish, then end the application at any time. You've successfully performed this tutorial.

Back to Topic List

Summary

In this tutorial, you've seen how to use a Web Service as a Data Control.

	Review the content of the Web Service xml file
	Create a Data Control based on a Web Service
	Create a JSF Page
	Use an operation of the Data Control in a JSF Page

Back to Topic List

Place the cursor over this icon to hide all screenshots.