com.smartgwt.client.docs
Interface ClientServerIntegration


public interface ClientServerIntegration

Like client-server desktop applications, SmartGWT browser-based applications interact with remote data and services via background communication channels. Background requests retrieve chunks of data rather than new HTML pages, and update your visual components in place rather than rebuilding the entire user interface.

SmartGWT supports two general classes of client-server operations: DSRequest (DataSource Requests) and RPCRequests (Remote Procedure Call Requests). DataSource requests are for manipulating structured data described by DataSource. RPCRequests are a low-level, very flexible mechanism for custom client-server communications. In an nutshell, RPCRequests:

DSRequests:

See the RPCManager documentation for further information on RPCRequests - the remainder of this document focuses on integrating DataSource operations with your server.

DataSource Creation

First you must create DataSource that describe the objects from your object model that will be loaded or manipulated within your application. All of ISC's most powerful functionality builds on the concept of a DataSource, and because of ISC's databinding framework (see DataBoundComponent), it's as easy to create a DataSource that can configure an unlimited number of components as it is to configure a single component.

There are a number of options for creating DataSources; for early prototyping, creating a DataSource by hand in either JavaScript or XML is simplest (this is covered under 'DataSource declaration'). Later on, you can pursue one of many 'metadata import' strategies for automatically leveraging your existing metadata.

Once you have a DataSource, you can bind a DataBoundComponent such as a ListGrid to it, call one of the 'DataBound Component Methods' on it, such as ListGrid.fetchData(), the ListGrid will send a background HTTP request to the server asking for data. You can set the log category "RPCManager" to DEBUG threshold to see the outbound request and the server's response.

In this case, the ListGrid is sending a DataSource operation request of type "fetch". To fulfill it, you will need to provide a set of matching records in one of many possible formats.

At this point your code is just a handful of lines (this example shows a DataSource created in JavaScript):

     DataSource.create({
         ID:"employees",
         fields:[ 
             ... 
         ]
     });
     ListGrid.create({
         ID:"myGrid",
         dataSource:"employees"
     });
     myGrid.fetchData();
 
If you now bind a DynamicForm to your DataSource, you can use the DynamicForm.editSelectedData(com.smartgwt.client.widgets.grid.ListGrid) and DynamicForm.saveData() methods to cause the client to submit "update" operations. For both "update" and "add" operations, the DSRequest object you receive will have inbound data that is expected to be committed to your data model.

Data Integration

There are two main approaches to integrating DataSources with your server technology:

Note that using WSDL-described web services is also considered a client-side integration approach, although in this case it is typical to use extensive third-party web service libraries such as Apache Axis to provide Java bindings.

The possible approaches are summarized in the diagram below. Paths 2, 3, and 4 are client-side integration approaches, and path 1 includes all server-side integration approaches.

All of these integration options can be used in parallel within the same application. For example, an application that typically talks to a Java backend may contact Yahoo's JSON-based search services to get related search results, or integrate with SalesForce applications via the AppForce WSDL-described web service.

If you cannot install the SmartGWT Server or must integrate with a pre-existing web service, then you must pursue 'client-side integration'. Otherwise there are several factors to consider: