■ListView

リストビューを表すオブジェクトです。

●イベント

selectedrowschangedイベント

listviewの現在の行が変更されたときにのみ発生するselectionchangedイベントとは異なり、ユーザーが選択した列をクリックしたときなど、リストビューの選択された行が変更されたときに発生します。

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
listview.bind("SelectedRowsChanged",function(){
//リストビューの選択行が変更されたときに行いたい処理をここで記載します。
});

valuechangedイベント

リストビューの値が変更されたときに発生します。
リストビューに数式（例："=H2$2")が含まれている場合、データ件数が多いとパフォーマンスに影響があります。例えばリストビューに表示しているデータが３レコードあった場合、数式の書かれているセルに対してユーザーが入力を行うと、本イベントが３回発生します。数式が含まれていてかつデータ件数が多い場合、一つの回避方法として以下の方法があります。

Copy Code

Forguncy.Page.getListView("リストビュー1").bind("ValueChanged", function (e, param) {
    if (window.myTimeout) {
        clearTimeout(window.myTimeout);
    }
    window.myTimeout = setTimeout(function () {
        //値を変更した後に行いたい処理を記載します。
    }, 10);
});

イベント発生時に実行される関数の第2パラメーターは次のように定義されます。

パラメーター

 interface ListViewValueChangedEventArg{
       CellRanges: CellRange[]; //どのセルの値が変更されたか
       OldRowCount: number; //値が変更される前のリストビューの行カウント
       NewRowCount: number; //値が変更された後のリストビューの行カウント
 }

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
listview.bind("ValueChanged", function (e, param) {
/* 
* listviewがリロードされた時、paramは次のようになります。:
* {
* CellRanges:[{Row:-1,Column:-1,RowCount:-1,ColumnCount:-1}],
* OldRowCount:0,
* NewRowCount:3,
* }
* 
* listviewで行1と列2のセルを編集すると、paramは次のようになります。:
* {
* CellRanges:[{Row:1,Column:2,RowCount:1,ColumnCount:1}],
* OldRowCount:3, 
* NewRowCount:3, 
* }
* 
* listviewでセル（1,2）をセル（3,4）にドラッグすると、paramは次のようになります。:
* {
* CellRanges:[{Row:1,Column:2,RowCount:1,ColumnCount:1},{Row:3,Column:4,RowCount:1,ColumnCount:1}],
* OldRowCount:3,
* NewRowCount:3,
* }
* 
* listviewで１行削除すると、paramは次のようになります。:
* {
* CellRanges:[{Row:-1,Column:-1,RowCount:-1,ColumnCount:-1}],
* OldRowCount:3,
* NewRowCount:2,
* }
* 
* listviewで１行追加すると、paramは次のようになります。:
* {
* CellRanges:[{Row:3,Column:-1,RowCount:1,ColumnCount:-1}],
* OldRowCount:3,
* NewRowCount:4,
* }
*/
});

●イベントハンドラの処理 

.bind( evenType [, eventData ], handler )

リストビューが持つイベントに対してイベントハンドラを紐づけます。

標準アクションの停止

紐づけたイベントの元々の動作をキャンセルするには、戻り値にfalseを返します。これにより、イベントバブリングも停止されるため、親要素が持つイベントの発生もキャンセルされます。

イベントへのデータの受け渡し

イベントハンドラにデータを受け渡すには、第2パラメーターに指定します。その場合、イベントハンドラは第3パラメーターに指定します。 受け渡されたデータは、イベントハンドラに渡されるjQueryイベントオブジェクトのdataプロパティから参照できます。

パラメーター

戻り値

なし 

.unbind( eventType [, handler ] ) 

指定したイベントハンドラの紐づけを削除します。第2パラメーターを省略した場合、指定イベントに紐づけされたすべてのイベントハンドラが削除されます。

パラメーター

戻り値

なし 

.unbindAll()

要素からすべてのイベントハンドラを削除します。

戻り値

なし  

●メソッド

.addNewRow(rowValues: {[columnName: string]: any;} | any[], isText: boolean)

リストビューに新しい行を追加します。

パラメーター

戻り値

なし

サンプルコード

Copy Code

//例えばlistivewに3つの列があったとします。
//1列目の列名は「Name」です。
//2列目の列名は「Birthday」です。
//3列目の列名は「Department」です。セル型はコンボボックス、値は1,2,3、表示値は "DD1"、 "DD2"、 "DD3"とします。
//以下の3つの使用法は、すべて同じ行を追加します。
//
//使用例１:
listview.addNewRow({"Name":"Tanaka","Birthday":new Date(1990,1,3),"Department":1});
//使用例２:
listview.addNewRow(["Tanaka",new Date(1990,1,3),1]);
//使用例３:
listview.addNewRow({"Name":"Tanaka","Birthday":"1990/01/03","Department":"DD1"}, true);
 
//テキストが正しい値に解析できない場合、このメソッドは例外をスローします。
//以下の例は例外をスローします:
listview.addNewRow({"Name":"Tanaka","Birthday":"aa","Department":"bb"}, true);

.addSelectedRow(rowIndex)

リストビューの選択列の指定した行のチェックボックスをチェックされた状態にします。

パラメーター

戻り値

なし

.clearAllSelectedRows()

リストビューの選択列のチェックボックスのチェックをすべて外れた状態にします。

戻り値

なし

.clearSelectedRow(rowIndex)

リストビューの選択列の指定した行のチェックボックスのチェックを外れた状態にします。

パラメーター

戻り値

なし

.clearSelectedRowByQuery(query：{[name：string]：any;})

クエリー条件に基づいてリストビューの選択した行をクリアします。

パラメーター

戻り値

なし

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
//IDが1の行をクリアします。
listview.clearSelectedRowByQuery({ID:1});

.getDataTableName()

リストビューに連結されているテーブル名を取得します。

戻り値

String

.getMergedColumnInfos()

リストビューのすべての列に関する情報（行ヘッダー、列の選択、列の非表示などを含む）を取得します。

戻り値

IMergedColumnInfo[] インターフェース

interface IMergedColumnInfo {
    DesignerColumnIndex: number; //デザイナである作業スペースの列番号。例えばA列は0、B列は1になります。
    ColumnName: string; //列の名前。
    ColumnType: enum;   //リストビューに記載されている情報を表すListviewColumnType列挙型。
}

ColumnTypeの列挙型は以下のとおりです。
enum ListviewColumnType {
        RowHeader = 0,
        SelectedColumn = 1,
        DataColumn = 2
}

サンプルコード

Copy Code

//listviewが行ヘッダー、選択された列、データ列を表示する場合
var columns = listview.getMergedColumnInfos();
//columnsは次のようになります:
//[{DesignerColumnIndex:0,ColumnType:0},{DesignerColumnIndex:0,ColumnType:1},{DesignerColumnIndex:0,ColumnType:2}]

.getName()

リストビューの名前を取得します。

戻り値

String

.getPaginationInfo()

リストビューがページングされている時、ページ情報（1ページの最大行数、ページ数、インデックス番号(0～)）を取得します。
ページングされていない時の戻り値はnullです。

戻り値

ListviewPaginationInfo

interface ListviewPaginationInfo {
    MaxRowCountOfOnePage: number;
    PageCount: number;
    PageIndex: number;//0～
}

サンプルコード

Copy Code

//このメソッドを使用する際は、PageDefaultDataLoadedイベントで行う必要があります。これは、ページのLoadedイベントで行うと、ページング情報が正しくない可能性があるためです。 
Forguncy.Page.bind(Forguncy.PageEvents.PageDefaultDataLoaded, function () { 
  var listview = Forguncy.Page.getListView("リストビュー1"); 
  var pagingInfo = listview.getPaginationInfo(); 
  /* pagingInfoは以下のようになります: 
  * { 
  * MaxRowCountOfOnePage:10, 
  * PageCount:3, 
  * PageIndex:0 
  * } 
  */ 
  listview.bind("reloaded", function () { 
  //ページナビゲーションのセル型のボタンをクリックすると、リストビューは新しいページでリロードされます。 
      var pagingInfo = listview.getPaginationInfo(); 
  }); 
}); 

.getRowCount()

リストビューに表示されているデータの行数を取得します。

戻り値

Number

.getSelectedRowsData()

選択された行データの配列を取得します。
行データは次のようになります。

戻り値

RowData

class RowData {
    RowIndex: number;//リストビューの選択された行の行番号。クエリーが空の場合のみ、RowIndexは有効な値を持ちます。 listviewの新しい追加行と同じです。
    Query: { [name: string]: any };//選択した行のクエリ情報
    Values: any[]; //選択した行のデータ
}

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1")
var rows = listview.getSelectedRowsData();

.getSelectedRowIndex()

選択行の行番号を取得します。行番号は0から始まります。

戻り値

Number

.getSelectedRowIndexs()

複数選択を行っている場合の選択行の行番号を取得します。行番号は0から始まります。

戻り値

Array

.getText(rowIndex: number, column: string | number): any;

リストビューの指定されたセルのテキストを取得します。

パラメーター

戻り値

Anything

サンプルコード

Copy Code

//listviewに2つのカラムがある場合、最初のカラムは "Name"、2番目のカラムは "Age"となります。
//最初の行の "Age"セルの値を取得する場合、以下のように記載します。
//使用例１:
 listview.getText(0,"Age");
//使用例２:
 listview.getText(0,1);

.getValue( rowIndex, columnName )

リストビュー内の指定したセルの値を取得します。

パラメーター

戻り値

Anything

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
listview.getValue(0, "年齢");
listview.getValue(0, 1);

.hiddenLoadingIndicator()

showLoadingIndicatorを呼び出すと、リストビューの表示が完了していないにも関わらずユーザーがリストビューに対して操作を行わないようにするために、インジケータが表示されている間リストビューを無効にできます。hiddenLoadingIndicatorが呼び出されると、リストビューは有効になります。

戻り値

なし

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
listview.showLoadingIndicator();
//listviewにデータをインポートします。
listview.hiddenLoadingIndicator();

.isSelectedRow(rowIndex)

リストビューの選択列の指定した行のチェックボックスの状態を取得します。

パラメーター

戻り値

Boolean

.reload()

リストビューのデータをサーバーから再読み込みします。

戻り値

なし

.selectAllRows()

リストビューの選択列のチェックボックスをすべてチェックされた状態にします。

戻り値

なし

.selectRow( index )

指定したリストビューの行を選択状態にします。

パラメーター

戻り値

なし

.setValue( rowIndex, columnName, value )

リストビュー内の指定したセルに値を設定します。

パラメーター

戻り値

なし

.showLoadingIndicator()

showLoadingIndicatorを呼び出すと、リストビューの表示が完了していないにも関わらずユーザーがリストビューに対して操作を行わないようにするために、インジケータが表示されている間リストビューを無効にできます。hiddenLoadingIndicatorが呼び出されると、リストビューは有効になります。

戻り値

なし

サンプルコード

Copy Code

var listview = Forguncy.Page.getListView("リストビュー1");
listview.showLoadingIndicator();
//listviewにデータをインポートします。
listview.hiddenLoadingIndicator();