Wijmo UI for the Web
DataView構成

Wijmo DataView を使用する場合の利点

データソースとのバインド処理を単純化できます。特に、データソースが遠隔地にある場合に大きな効果を発揮します。

Wijmo DataView をリモートのデータソースにバインドするには、DataView オブジェクトの作成時にリモートデータソースのURL、およびクエリオプションを設定し、DataView の refresh 機能を呼び出します。

RESTful サービス
コードのコピー
var productView = new wijmo.data.AjaxDataView(
    "http://demo.componentone.com/aspnet/NorthwindAPI/api/read/Product",
    {
        pageSize: 10
    });
productView.refresh();

さまざまなデータソースに対するクエリ操作を統一し、単純化できます。

Wijmo DataView により、さまざまなデータソースに対するクエリ操作を統一できるため、バインドするデータソースの種類に関係なく filtersort、 pageSize、およびpageIndex機能を呼び出すことができます。

フィルタリング

ID が「1」であるアイテムを取得するには、次のようなコードを記述します。

Filtering
コードのコピー
data.filter({id: 1});

並べ替え

id フィールドを降順に、name フィールドを昇順に並べ替えるには、次のようなコードを記述します。

Sorting
コードのコピー
data.sort(“id desc, name”);

ページ設定

ページあたりのレコード数を 10 に設定し、3 ページ目を表示するには、次のようなコードを記述します。

Paging
コードのコピー
data.pageSize(10);
data.pageIndex(2);

KnockoutJS へのサポートを提供します。

Wijmo DataView の toObservableArray機能を使用すると、Knockout 対応の監視可能な配列を取得し、この配列を Knockout ViewModel にバインドできます。

Wijmo DataView を使用しない場合の問題点

Wijmo DataView を使用せずにデータを取得した場合は、追加処理が発生します。

たとえば、RESTful サービスからデータを取得する場合、以下の処理を実行しなければなりません。

  1. Ajax 経由で XHR オブジェクトを取得します。
  2. Ajax に対して成功、完了、およびエラーを示すコールバックを定義します。
  3. クライアントのリモートサービスからの結果を解析し、保存します。

関連トピック

参照

 

 


Copyright © GrapeCity inc. All rights reserved.