nablarch.ui.AutoSpan Class
カラム値による自動行連結機能
上下に隣接するセルにおいて、特定の属性値が同じあった場合に自動的にセルを連結させる機能。 本機能を用いることで場合、一般的な実装に比べてサーバサイド側のロジックを軽減することができる。
なお、データのソートはサーバ側の処理で 事前に行っておく必要がある。
動作仕様
以下の条件を満たすセルをrowspan を用いて連結する。 連結後に残るのは、一番上側の列に存在するセルのみである。
- selector属性に合致する。
- 上下方向に隣接している。
- data-autospan属性の値が一致している。
マークアップ仕様
次の例では「ユーザ名」カラムの data-autospan の値が一致する隣接セルが結合される。
<table>
<tr>
<th class="nablarch_AutoSpan -selector td.userName">ユーザ名</th>
<th> 利用年月 </th>
<th> 月別課金額 </th>
</tr>
<tr>
<td class="userName" data-autospan="user001">ユーザ001</td>
<td> 2009/12 </td>
<td> 4321 円 </td>
</tr>
<tr>
<td class="userName" data-autospan="user001">ユーザ001</td>
<td> 2010/12 </td>
<td> 5832 円 </td>
</tr>
<tr>
<td class="userName" data-autospan="user001">ユーザ001</td>
<td> 2011/1 </td>
<td> 899 円 </td>
</tr>
...
<tr>
<td class="userName" data-autospan="user002">ユーザ002</td>
<td> 2009/10 </td>
<td> 3455 円 </td>
</tr>
...
</table>
Methods
AutoSpan
(
AutoSpan
-
element
-
option
コンストラクタ
Parameters:
-
element
HTMLElementマーカCSSを指定したDOMノード
-
option
Objectオプションを格納したオブジェクト selector: 結合対象のセルを指定するセレクタ式
Returns:
AutoSpan:
インスタンス
Properties
$cols
JQuery
結合対象のセルを格納する結果セット
$table
JQuery
結合対象のセルを含むテーブル
selector
String
結合対象のセルを指定するセレクタ式
widgetType
String
final
static
モジュール識別名