pp108 : Buscontrol

Buscontrol

Listens to the busdataisland component and appropriately presents the transaction object to the user in HTML format.

Syntax

HTML

<ELEMENT class="BusControl">...</ELEMENT>

Scripting

elementID.className="BusControl"; application.initializeHTMLElements(elementID)

The buscontrol library presents the data contained in a busdataisland in HTML format to the user. The buscontrol requests for all the tuples in the busdataisland and generates HTML for each tuple. The busdataisland to be used is defined by setting the BusDataIsland property on any HTML element below the HTML element where the buscontrol is attached. This element should be the root of the HTML that has to be generated for each tuple in the busdataisland. This element with all its content (child elements) is called the HTML template since this is the template that should be cloned for each tuple.

An XQL attribute is set to each HTML element that uses the buscontrol for rendering data. The buscontrol loops recursively through the HTML and its descendants, checks whether this attribute is set, and if it is, executes the XQL on the current tuple. If data is found, its text content is added to the HTML element.

One buscontrol definition can be nested in another buscontrol. In such a case, the binding of the outer buscontrol is stopped when the inner buscontrol is reached. The whole process is done recursively.

The buscontrol also takes care of all the changes made to the HTML and makes the corresponding changes in a SOAP Body in the busdataisland. These changes can be addition, deletion, or update of data.

Note that the synchronization only takes place with the busdataisland. In order to synchronize with the backend, the synchronize() method of the busdataisland has to be called manually.

To dynamically add and initialize this component, you can use the initializeHTMLElements() or addType() methods of the Application object.

The properties, methods and events defined for the buscontrol are as follows:

Table 1. List of Attributes

Attribute

Property

Description

onbind

onbind

Pointer to a function that will be executed each time when the tuple is bound to the HTML element.

initHTML

initHTML

Set this property to True, to explicitly initialize the template if it contains a library. By default, this is set to False.

<TBODY class="BusControl">
    <tr BusDataIsland="bdiRequest" initHTML="true" style="height:100px" xql=".">
        <td>
            <label xql="FirstName/textnode()"/>
        </td>
        <td>
            <div cordysType="wcp.library.ui.Dropdown" xql="TitleOfCourtesy/textnode()">
                <DIV value="ms.">Ms</DIV>
                <DIV value="mr.">Mr</DIV>
            </div>
        </td>
    </tr>
</TBODY>
Table 2. List of Methods

Method

Description

rebind

Regenerates HTML for all the tuples in the busdataisland.

Table 3. List of Events

Event

Description

onhtmlcloned

Fires when a clone is created for a tuple.

onbeforebind

Fires each time before a tuple is bound to HTML.

Note:

  1. It is important to note that the buscontrol can be bound to any element of the HTML, but it should be defined above the definition of the busdataisland.
  2. When a developer assigns values programmatically to hidden fields, he should remove the NULL attribute for the data node of the HTML element, if present. This is applicable only for data binding using OLE DB connectors and when the property NULL precedence is set to true for the application connector.

The basic functions of the buscontrol are:

  1. Listen for the events from busdataisland and present the data in HTML format.
  2. For each tuple in the busdataisland, create a clone of the HTML template and fill in the required data.
  3. Track the changes made to the HTML and make appropriate changes to the busdataisland.

Example

The following example demonstrates the use of the buscontrol in an HTML page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>Buscontrol Demo</title>
	<script type="text/javascript" src="/cordys/wcp/application.js"></script>
	<script type="text/javascript" language="JScript">
		function fillGender(html, busObject, element)
		{
			if (cordys.getTextContent(element).indexOf("Mr") != -1)
			{
				html.value = "Male";
			}
			else
			{
				html.value = "Female";
			}
		}
		function responseReceived()
		{
			var nsArray = cordys.getXMLNamespaces(application.event.response.ownerDocument);
			nsArray["tns"] = "http://schemas.cordys.com/NWDatabaseMetadata";
			cordys.setXMLNamespaces(application.event.response.ownerDocument, nsArray);
		}
	</script>
	<script type="cordys/xml" id="constructor">
		<SOAP:Envelope xmlns:SOAP="http://schemas.xmlsoap.org/soap/envelope/">
		  <SOAP:Body>
			<GetEmployeesObjects xmlns="http://schemas.cordys.com/DemoWebServices">
			  <fromEmployeeID>1</fromEmployeeID>
			  <toEmployeeID>10</toEmployeeID>
			</GetEmployeesObjects>
		  </SOAP:Body>
		</SOAP:Envelope>
	</script>
</head>
<body>
	<div style="display: none;" cordysType="wcp.library.data.BusDataIsland" async="false" id="bdiEmployees" request="constructor.XMLDocument" onresponse="responseReceived()" updateNamespace="http://schemas.cordys.com/NWDatabaseMetadata"></div>
    <table border="1" align="center">
        <thead align="center">
            <td><label>FirstName</label></td>
            <td><label>LastName</label></td>
            <td><label>Gender</label></td>
        </thead>
        <tbody class="BusControl">
            <tr BusDataIsland="bdiEmployees" xql=".">
                <td><input xql="tns:FirstName/text()"></td>
                <td><input xql="tns:LastName/text()"></td>
                <td><input xql="tns:TitleOfCourtesy/text()" onbind="fillGender"></td>
            </tr>
        </tbody>
    </table>
</body>
</html>