データグリッド - 事前定義クエリの表示

v11 release 1より、事前定義クエリはタブおよびサイドバーオブジェクトで表示できるようになりました。 この例では、4D Ajax Framework Javascript APIを使用して事前定義クエリの表示を設定する方法をお見せします。

ステップ 1: データグリッドの作成

データグリッドオブジェクト (myDataGrid) は他の関数より前に宣言します。 これにより変数myDataGridはグローバルとなり、複数の関数からアクセス可能になります。

onAfterInit関数では、データグリッドオブジェクトが二行のコードで作成されています:

  myDataGrid=new dax_dataGrid('Hospital',$('grid_div'),1,0,false);
  myDataGrid.go();

dax_dataGrid関数は5つの引数をとります。一番目の引数は、表示させたいビューまたはテーブルの 4D Ajax Frameworkエイリアスです。二番目は場所です。この例ではgrid_divという名前の div要素に置かれます。残り三つはオプションで、それぞれヘッダ行数、ロックする左の列、 行フォームのへのデータ入力を設定します。

ステップ 2: クエリのタブ表示を開始

事前定義クエリの表示は一行で行うことができます。コードあるいは4D Ajax Frameworkコントロールパネルで 構築されたクエリのみが表示されます。事前定義クエリをJavaScriptで作成することはできません。 コードは以下のようになります:

  myDataGrid.showQueryTabs();

Step 3: クエリのサイドバー表示を開始

このステップの二つのボタンは、単純なJavaScriptを使用して、4D Ajax Framework に動作を指示します。ひとつはサイドバーを右側に表示し、もう一つは右に表示します:

  myDataGrid.showQuerySidebar('left');
  myDataGrid.showQuerySidebar('right');

デモページでお見せした通り、ここでタブを隠しています。これは別のコードで行っています。 このコードは必須という訳ではありません。これは単にタブを隠します。

  myDataGrid.hideQueryTabs();

Step 4: クエリの表示/非表示

タブやサイドバーの表示/非表示には、それぞれ一行のJavaScriptを使用します。 これらのボタンには以下のJavaScriptが書かれています:

  myDataGrid.hideQueryTabs();
  myDataGrid.hideSidebar();
  myDataGrid.showQuerySidebar();
  myDataGrid.showQueryTabs();