Servoy で e-Sales Manager 連携Web アプリを構築

Jerod Johnson
Senior Technology Evangelist

Servoy Developer を使用して e-Sales Manager のデータに簡単に接続し、リアルタイムe-Sales Manager のデータ連携Web アプリを構築できます。

Servoy は、迅速なアプリケーション開発およびデプロイメントプラットフォームです。CData JDBC Driver for e-Sales Manager Remix と組み合わせることで、リアルタイムのe-Sales Manager のデータと連携するe-Sales Manager 接続アプリを構築できます。この記事では、Servoy からe-Sales Manager に接続し、e-Sales Manager のデータを表示・検索するシンプルなWeb アプリを構築する方法を説明します。

CData JDBC Driver は、最適化されたデータ処理機能を組み込んでおり、リアルタイムのe-Sales Manager のデータを操作する際に比類のないパフォーマンスを提供します。e-Sales Manager に複雑なSQL クエリを発行すると、ドライバーはフィルタや集計などのサポートされているSQL 操作を直接e-Sales Manager にプッシュし、サポートされていない操作（多くの場合SQL 関数やJOIN 操作）は組み込みのSQL エンジンを使用してクライアント側で処理します。組み込みの動的メタデータクエリにより、ネイティブのデータ型を使用してe-Sales Manager のデータを操作できます。

Servoy Developer でe-Sales Manager に接続

e-Sales Manager 連携アプリを構築するには、まずCData JDBC Driver for e-Sales Manager Remix を使用してServoy Developer でデータプロバイダーを作成する必要があります。

JDBC Driver をインストールします。
JDBC Driver の JAR ファイル（cdata.jdbc.esalesmanager.jar）を、Servoy のインストールディレクトリにある /application_server/drivers/ ディレクトリにコピーします。
Servoy Developer を開きます。
Solution Explorer で、Database Server（Resources 配下）を右クリックし、「Connect to existing database」->「empty」を選択します。
1. サーバーに名前を付けます。
2. クリックして詳細サーバー設定を表示します。
  - URL を設定します（例：jdbc:esalesmanager:User=MyUsername;Password=MyPassword;URL=MyInstanceURL;TenantId=MyTenantId;）
    
    組み込みの接続文字列デザイナー
    
    JDBC URL の構築については、e-Sales Manager JDBC Driver に組み込まれている接続文字列デザイナーを使用してください。JAR ファイルをダブルクリックするか、コマンドラインからJAR ファイルを実行します。
```
				java -jar cdata.jdbc.esalesmanager.jar
				
```
    接続プロパティを入力し、接続文字列をクリップボードにコピーします。
    
    e セールスマネージャー Remix に接続するには、User、Passowrd、URL、TenantId パラメータが必要です。
    - User：API を実行するためのログインユーザーのユーザーID。
    - Password：API を実行するためのログインユーザーのユーザーパスワード
    - URL：e-Sales Manager Remix エンドポイントへのURL。例：https://XXX.softbrain.co.jp
    - TenantId：e-Sales Manager Remix テナント名のTenantd。例：cdata
  - 先ほどコピーしたDriver クラスを選択します（例：cdata.jdbc.esalesmanager.ESalesManagerDriver）

e-Sales Manager 連携Web アプリの構築

Servoy Developer のリソースでe-Sales Manager への接続を設定したら、リアルタイムのe-Sales Manager のデータにアクセスできるアプリを構築する準備が整います。

新しいソリューションの作成

Server Explorer で「All solutions」を右クリックし、「Create new solution」を選択します。
ソリューションに名前を付けます。
「search」モジュールを含めるチェックボックスを選択します。
「Finish」をクリックします。

新しいフォームの作成

「Forms」を右クリックし、「Create new form」を選択します。

フォームに名前を付けます。
データソースを選択します。
タイプ（例：Simple）を設定し、「Finish」をクリックします。

フォームにデータグリッドを追加

Data Grid コンポーネント（Servoy NG-Grids から）をフォームにドラッグします。
カラムコンポーネントをData Grid にドラッグし、各カラムコンポーネントの「dataprovider」プロパティをe-Sales Manager の「テーブル」のカラムに設定します（例：Customer テーブルの Name）。

必要に応じてカラムを追加します。

アプリに検索機能を追加

検索機能を追加するには「svySearch」拡張機能が必要です（新しいソリューションを作成する際にデフォルトで含まれています）。ソリューション作成時に拡張機能を追加しなかった場合や、既存のソリューションを変更する場合は、Modules（ソリューション内）を右クリックし、「Add Module」を選択して検索モジュールを追加できます。「svySearch」を選択し、「OK」をクリックします。

Text Field コンポーネントをフォームにドラッグします。
フォームを右クリックし、「Open in Script Editor」を選択します。
検索値を保持する新しい変数（JavaScript）を作成します：
```
var searchText = '';
```
フォームに戻り、Text Field のプロパティで：
1. 「dataprovider」プロパティを先ほど作成したフォーム変数に設定します。
2. ダブルクリックしてonAction イベントのメソッドを追加します。
3. クリックして「Form」にメソッドを作成し、メソッドに名前を付け（例：onEnter）、「Create private」をクリックします。
4. 「OK & Show」をクリックします。
JavaScript ファイルに以下のJavaScript を追加して、Servoy フレームワークを使用し、Text Field のテキストに基づいてバインドされたデータを検索する機能を実装します：
```
var search = scopes.svySearch.createSimpleSearch(foundset).setSearchText(searchText);
search.setSearchAllColumns();
search.loadRecords(foundset);
```