Studio 2.2 Support

Owned by Xiaoyan Kong (Unlicensed)
Last updated: Oct 24, 2012

Getting Started with the Data Framework and Nexaweb Studio 2.2

Nexaweb Studio 2.2 provides new components to aid you in connecting your Nexaweb client applications to data sources. These components allow you to:

See the Studio Guide within Eclipse Help Contents for more information on Nexaweb Studio.


Creating a Data Source

You create data source components that you can then use to serve data to your Nexaweb applications from databases on your server or network location.
 
To create a data source, follow these steps:
  1. To open the Create Data Source wizard, either:

    Select Outline view
         - Right click on any nxml component tag
         - Select Data binding > Create data source.
         The Create Data Source wizard appears.
    Select Navigator view
          - Drag data source XML file from project directory for this application into any nxml component. The Create Data Source wizard appears with documentDataSource selected as Type
    Select Package Explorer view
          - Drag object data source Java file from project directory for this application into any nxml component. The Create Data Source wizard appears with objectDataSource selected as Type after MCO tag id wizard.
     

  2.   Complete the Create Data Source wizard as follows:

Type: Specify whether this data source is a document or an object.

ID: Specify an ID for this data source.

Source URL: Specify a URL for this data source. (If you drag a data source component from the project directory, the name of that component appears in this field. ) Or click the button next to the Source URL field to specify the data source.

Create MCO Class: Optionally, to create a MCO to use as a data source:

  • Select Create MCO Class from the popup menu.
    The New Managed Client Object wizard appears.
    For information on creating a MCO, see Creating Managed Client Objects (MCOs) in the Nexaweb Studio User Guide.

    The MCO you created appears in the Source URL field.

Create JSP: Optionally, to create a JSP stub file to use as a data source:

  • Select Create JSP stub file from the popup menu.
    The New Nexaweb JSP Page wizard appears.

    The JSP file you created appears in the Source URL field.

Choose MCO: Optionally, to choose a MCO already included in this project as a data source:

  1. Select Choose MCO from the popup menu.
    The Data Source MCO picklist appears.

  2. Select the MCO to use from the list and click OK.
    The MCO you selected appears in the Source URL field.

Choose File: Optionally, if you specified document as the type for this data source: Select Choose File to specify the file.
A Choose a file dialog box appears.
Select the file to use and click Finish.
The file you selected appears in the Source URL field.

Click OK. The data source you added appears in the Outline view under Data > Data Sources. 
 

Creating a Binding

You create bindings to connect your Nexaweb application with various data sources.  

To create a binding, follow these steps:
  1. To open the Create Binding wizard:

    Select Outline view
         - Right click on any nxml component tag.
         - Select Data binding > Create Binding.
         The Create Binding wizard appears.

  2. Complete the Create Binding wizard as follows:

    ID: Specify a system wide unique value to identify this binding.

    Data Source: Specify the ID of a data source from which this binding obtains data.

    Select statement: Specify a query string specific to the data source.

    Binding type: Select a type for this binding: one_time (gets data once and does not refresh) or one way (refreshes data at intervals when it changes at the source.)

    Formatter: Optionally, specify the ID of a formatter used to format raw data before display. You can chain formatters if you require more than one.

  3. Click OK.

    In Outline View, a new binding appears beneath Data > Bindings, and beneath the <nxml>.

Create a Binding to a Component Attribute

You can create a binding to an attribute of a component  to bind the attribute value to a datasource or binding elemet.

To create a binding to a component attribute, follow these steps:
  1. To open the Data Bind Component Attribute wizard:

    Select Outline view
         - Right click on nxml component tag for which you want to bind a component attribute.
         - Select Data binding > Bind component attribute.
         The Bind Component Attribute wizard appears.
    Select Package Explorer view
         - Drag Java method from package to any nxml component.
           The Bind Component Attribute wizard appears.
    Select Outline view
          - Drag data source component to any nxml component.
           The Bind Component Attribute wizard appears.
    Select Outline view
          - Drag binding to any nxml component.
           The Bind Component Attribute wizard appears.
     

  2. Complete the Bind Component Attribute wizard as follows:

    Attribute name: Select the attribute to bind from the dropdown list.

    Attribute value: Specify the XPath expresion to use to bind this attribute.

  3. Click OK.

    In Outline View, a new attribute binding appears next to the nxml component tag with which you associated this binding.


Creating an Iterator

Use iterators to allow data sources that have multiple rows of data to display them in an iterative fashion.

To create an iterator, follow these steps:
  1. To open the Create Iterator wizard:

    Select Outline view
         - Right click on a nxml component tag for which you want to use an interator.
         - Select Data binding > Insert iterator.
         The Create Iterator wizard appears.

  2. Complete the Create Iterator wizard as follows:

    Name: Specify a system wide unique value to identify this iterator.

    Data Source: Select the project data source to iterate from the drop down list.

    Select statement: Specify the XPath select statement to obtain the data from the datasource.

    Binding type: Select a binding type for this iterator from the drop down list: one_time (gets data once and does not refresh) or one way (refreshes data at intervals when it changes at the source.)

  3. Click OK.

    In Outline View, the iterator appears beneath Data > Iterators and above the nxml component tag with which it associates.

Wrapping an Iterator

You can wrap an element in your UI in an iterator.

To wrap an iterator, follow these steps:
  1. To open the Create Iterator wizard:

    Select Outline view
         - Right click on a nxml component tag for which you want to use an interator.
         - Select Data binding > Wrap with iterator.
         The Create Iterator wizard appears.

  2. Complete the Create Iterator wizard as follows:

    Name: Specify a system wide unique value to identify this iterator.

    Data Source: Select the project data source to iterate from the drop down list.

    Select statement: Specify the XPath select statement to obtain the data from the datasource.

    Binding type: Select a binding type for this iterator from the drop down list: one_time (gets data once and does not refresh) or one way (refreshes data at intervals when it changes at the source.)

  3. Click OK.

    In Outline View, the iterator appears beneath Data > Iterators and above the nxml component tag with which it associates.


 

Creating a Data Bound Form

A Date Bound Form allows you to define the fields to appear on the form as you select the data from this source to bind to this form.

To create a data bound form, follow these steps:

  1. In the Navigator view:

    - Right click on an MCO java file
    - Select Nexaweb > Generate Data Bound Form.
    The Generate data bound form wizard appears.

    Nexaweb Project: Specify the Nexaweb project

    Form's top level container: Select from the drop down list the type of container to use at the top level for this form.

    Label / Field Relationship:  Select from the drop down list the look of the label \ field layout to use for this form.

    Add OK button to form: Check off checkbox to add an OK button to this form.

    Add Cancel button to form: Check off checkbox to add a Cancel button to this form.

    ID: Specify the ID of the datasource you want to bind to this form.

    Source URL: Click the arrow to specify one of the followng options as a source URL for this form:

        * Create MCO class
          The New Managed Client Object wizard appears.
        * Create JSP stub file
          The New Nexaweb JSP page wizard appears.
        * Choose MCO
          The Data Source MCO dialog box appears.
        * Choose a file
          The Choose a file dialog box appears.

    Binding prefix: Optionally, specify a prefix identifying the path to the data used in this binding.

  2. Click Next.

    The Field binding and widget settings dialog box appears.

  3. Choose the fileds to place in the form and specify their properties as follows:

    Bind: Click the bind check  box beside the data you want to bind to the UI.

    Bind Query String: Specify an alternative bind query string to obtain this piece of data from the source.

    Binding Type: Click the binding  type field to select the binding type: one_time (gets data once and does not refresh) or one_way (refreshes data at intervals when it changes at the source.)

    Widget Type:  Click the Widget Type field to select the type of widget within the UI component to which to bind this piece of data.

  4. Click Next.

    The Binding Location column appears on the Field Settings dialog box.

  5. Choose the field attributes where the bindings occurs to use in the form.
     
  6. Click Next.

    A dialog box appears on which you specify the file to use as the data bound form.

    Enter or select the parent folder: Enter the parent folder of the file to use as the data bound form, or select the file from project lists shown.

    Field Name: Specify a name for this file.

    Advanced:  Optionally, click Advanced to specify a file to which to link this file. Click the Link to file in filesystem check box. Specify the file name or click Browse to locate a file. Click Variables to specify defined path variables.

  7. Click Finish.

    Nexaweb displays the data bound form in Nexaweb Visual Editor, and lists the file in Navigator view under MCO source for the project.