Building Web Applications > The Network View Faces Component > Configuring a Network View Faces Component > Connecting a Business Data Source

To be able to display network objects, the network faces component must be connected to a data source. This can be done in different ways:

This section explains the different ways to configure a data source within the network faces component. The easiest way to provide server-side customization and business data to a network faces component is through the project tag attribute. It allows you to specify a JViews TGO project that will be set to the underlying IlpNetwork on the server side (see Loading a Project File in the Graphic Components documentation for more information). Keep in mind that not all CSS view customizations are supported by the network faces component (see Network View Component Services for details).

How to Set a JViews TGO Project to a networkView Faces Component

The following example shows how to pass a JViews TGO project to the networkView component, and to configure the component dimensions (width and height) using the style tag attribute:

<jvtf:networkView id="aNetwork" 
                    context="#{contextBean}"
                    style="width:740;height:550" 
                    project="data/myProject.itpr" />

If you have started the bundled Tomcat web server, the following link will take you to the small sample illustrating this:

http://localhost:8080/jsf-network-step-by-step/faces/example2.jsp

You will find more information about the sample web application in:

<installdir>/samples/faces/jsf-network-step-by-step/index.html

where <installdir> stands for the directory where ILOG JViews TGO is installed.

The id tag attribute defines a unique identifier for the networkView component. The context tag attribute is a binding to a bean defined in the faces_config.xml file. The style tag attribute defines two CSS properties (width and height) for the dimensions, in pixels, of the network component. The project tag attribute is a relative path to a JViews TGO project within the web application. This file should be accessible by the web application.

The following example shows how to declare the context bean in the faces_config.xml file:

<managed-bean>
    <managed-bean-name>contextBean</managed-bean-name>
    <managed-bean-class>
     ilog.tgo.faces.service.IltFacesDefaultContext
    </managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
</managed-bean>

The context should implement the IlpContext interface and must use the synchronization strategy IlSynchronizeOnLockStrategy in order to address the particular threading issues of a web server.

How to Declare a dataSource Faces Component for the Network View

Another way to connect business data to the network view is through the dataSource faces component. This component represents a wrapper for an IlpAbstractDataSource object that can be connected to a network component. Many different data source components can be declared in a given JSP page, but only one can be connected to the network view at a time. It is possible to switch data sources dynamically.

The following example shows how to declare a data source in a JSP page:

<jvtf:dataSource id="myDataSource" value="#{dataSourceBean}" />

The id tag attribute defines a unique identifier for the data source component. The value tag attribute gets a value binding to a bean previously declared in the faces_config.xml file that extends IlpAbstractDataSource.

How to Connect the dataSource Faces Component to the networkView Faces Component

Once the data source has been declared, you can connect it to the network view as follows:

<jvtf:networkView id="aNetwork" 
                    context="#{contextBean}"
                    style="width:740;height:550" 
                    dataSourceId="myDataSource" />

The dataSourceId tag attribute gets the unique identifier of the data source component that will connect it to the network view.

The following example shows how to declare the dataSource bean in the faces_config.xml file:

<managed-bean>
  <managed-bean-name>dataSourceBean</managed-bean-name>
  <managed-bean-class>ilog.cpl.datasource.IlpDefaultDataSource</managed-bean-class>
  <managed-bean-scope>session</managed-bean-scope>
  <managed-property>
    <property-name>context</property-name>
    <property-class>ilog.cpl.service.IlpContext</property-class>
    <value>#{contextBean}</value>
  </managed-property>
  <managed-property>
    <property-name>fileName</property-name>
    <property-class>java.lang.String</property-class>
    <value>data/myNetwork.xml</value>
  </managed-property>
</managed-bean>

The dataSource bean is declared and two properties are set: context and fileName. The context property is set with a value binding to a context bean. It is mandatory, so that the JViews TGO context is consistent across components. The fileName property gets a relative path to an XML file compatible with the data source and accessible from the web application.

If you have started the bundled Tomcat web server, the following link will take you to the small sample illustrating this:

http://localhost:8080/jsf-network-step-by-step/faces/example3.jsp

You will find more information about the sample web application in:

<installdir>/samples/faces/jsf-network-step-by-step/index.html

where <installdir> stands for the directory where ILOG JViews TGO is installed.

How to Set a Data Source Bean to a networkView Faces Component

It is also possible to set a data source bean directly to the network view component, without requiring the data source component.

For example:

<jvtf:networkView id="aNetwork" 
                    context="#{contextBean}"
                    style="width:740;height:550" 
                    dataSource="#{dataSourceBean}" />

The dataSource tag attribute gets a value binding to a bean that extends IlpAbstractDataSource. It will connect the network component to this data source bean.

How to Use the data Tag Attribute of the networkView Faces Component

The network view faces component has a multipurpose data tag attribute, which can be used to connect business data sources using:

Note
You must not use any combination of the following tag attributes, which allow you to connect the network view to any form of data source:

When used with JViews TGO projects, the data tag attribute behaves exactly like the project attribute, getting the relative path to a JViews TGO project, as in the following example:

<jvtf:networkView id="aNetwork" 
                    context="#{myContext}"
                    style="width:740;height:550" 
                    data="data/myProject.itpr" />

Here myProject.itpr is the project file within the web application.

If you have started the bundled Tomcat web server, the following link will take you to the small sample illustrating this:

http://localhost:8080/jsf-network-step-by-step/faces/example4.jsp

When used with the unique identifier of a data source faces component, the data tag attribute behaves exactly like the dataSourceId attribute, getting the unique identifier of a data source component, as in the following example:

<jvtf:networkView id="aNetwork" 
                    context="#{myContext}"
                    style="width:740;height:550" 
                    data="myDataSource" />

Here myDataSource uniquely identifies a data source faces component in the current session.

If you have started the bundled Tomcat web server, the following link will take you to the small sample illustrating this:

http://localhost:8080/jsf-network-step-by-step/faces/example5.jsp

When used with an IlpAbstractDataSource instance, the data tag attribute behaves exactly like the dataSource attribute, getting a value binding to a bean that extends IlpAbstractDataSource, as in the following example:

<jvtf:networkView id="aNetwork" 
                    context="#{myContext}"
                    style="width:740;height:550" 
                    data="#{dataSourceBean}" />

Here #{dataSourceBean} is a value binding to the corresponding bean declared in the faces_config.xml file.

If you have started the bundled Tomcat web server, the following link will take you to the small sample illustrating this:

http://localhost:8080/jsf-network-step-by-step/faces/example6.jsp