概要

グリッドを表示します。

  • 分類 : コンテナ
  • スクリーンショット
    • bNavig="false"
      screenshot.png
    • bNavig="true"
      screenshot2.png
    • bNavig="false"、switchable="false"
      screenshot3.png
  • タグの記述例
      1
      2
      3
      4
      5
      6
      7
      8
      9
     10
     11
     12
     13
     14
     15
     16
     17
     18
     19
     20
     21
    
    <grid name="grdNew" 
          top="200" 
          left="250"
          tabIndex="0" 
          height="100" 
          sortCol="0"
    >
      <gridHeader width="50" title="ヘッダ" type="string"/>
      <gridHeader width="50" title="ヘッダ" type="string"/>
      <gridHeader width="50" title="ヘッダ" type="string"/>
      <gridLine>
        <gridCell value="セル1_1"/>
        <gridCell value="セル1_2"/>
        <gridCell value="セル1_3"/>
      </gridLine>
      <gridLine>
        <gridCell value="セル2_1"/>
        <gridCell value="セル2_2"/>
        <gridCell value="セル2_3"/>
      </gridLine>
    </grid>

grid

レイアウト

  • 属性一覧
属性名概要必須形式デフォルト値
nameGUIオブジェクト名string
top左上のy座標number
left左上のx座標number
heightグリッド全体の高さnumber100
draggableマウスによる移動を可能にするフラグ

true : 移動可能
false : 移動不可
booleanfalse
lineHeight行の高さnumber12
bNavigグリッドの表示モードを指定する。ナビゲーションモードではrang属性で指定した行数ごとにテーブルデータを切り替え表示する。ブロックモードではテーブルデータをすべて表示する

true : ナビゲーションモード
false : ブロックモード
booleanfalse
rangbNavig属性がtrue(ナビゲーションモード)の場合、一度に表示する行数number15
switchable表示モードの切り替えを有効にする

true : 有効
false : 無効
booleantrue
sortable列のソートを有効にする

true : 有効
false : 無効
booleantrue
actifClicマウスでの選択を有効にする

true : 有効
false : 無効
booleantrue
multiSelect複数行(あるいは複数セル)の選択を有効にする

true : 複数行選択
false : 単一行選択
booleanfalse
cellActiveマウスで選択してアクティブ表示になるテーブルデータの対象

true : セル
false : 行
booleanfalse
writableセルのデータ編集を有効にする

true : 有効
false : 無効
booleanfalse
boolPrintブラウザの別ウィンドウを生成しフレーム内部を表示する機能を有効にする。有効の場合、フレームバーとプリントボタンが表示される

true : 有効
false : 無効
booleantrue
tabIndexタブキーを押したときにフォーカスが移動する順番number-1
widthLastCell右端の列の幅number20
sortCol初期表示時にソートを行う列を指定するnumber0
sortType初期表示時に行うソートの昇降を指定するフラグ

"asc" : 昇順
"desc" : 降順
enum"asc"
onCellEditセルのデータ編集時に呼び出す関数名。function
  • 子要素一覧
要素名概要繰り返し
gridHeaderグリッドのヘッダ部分を表示します。0..*
gridLineグリッドの行を表示します。0..*
  • イベント一覧
イベント名概要発生箇所発生タイミング
onclickクリック時gridonclick
ondblclickダブルクリック時gridondblclick
onCellWriteセルのデータ編集終了時gridonCellWrite

データバインド

  • データ取得メソッド
メソッド名処理概要返却値説明
デフォルト全ての行の全てのセルの値を含む、string型の2次元配列を取得するstring[][]セルのvalueプロパティ
selectedIndex選択されている行の行番号を取得する
複数行選択されている場合、最後に選択した行の行番号を取得する
number選択されている行の行番号
selectedIndexesチェックされている行の行番号を要素とするnumber型の配列を取得するnumber[]選択されている行の行番号
  • データ設定メソッド
メソッド名処理概要パラメータ説明
デフォルト全ての行の全てのセルに値を設定するvaluestring[]セルに格納する文字列

gridHeader

レイアウト

  • 属性一覧
属性名概要必須形式デフォルト値
widthヘッダの幅number50
title表示されるテキストstring
type列の値の型。下記の3つのいずれかを指定する。ここで指定した型に基づいて列ソートされる

"date" : 日付
"number" : 数字
"string" : 文字列
enum
  • 子要素一覧: なし
  • イベント一覧: なし

gridLine

レイアウト

  • 属性一覧: なし
  • 子要素一覧
要素名概要繰り返し
gridCellグリッドのセル0..*
  • イベント一覧: なし

gridCell

レイアウト

  • 属性一覧
属性名概要必須形式デフォルト値
valueセルの値string
  • 子要素一覧: なし
  • イベント一覧: なし