web-dev-qa-db-ja.com

Ag-Gridは行を展開します

Ag-gridを使用してテーブルを制御しますが、行グループを2クリックで展開する代わりに、行のリストを格納するグループにしたいのですが、1クリックしたいと思います。アイコンの矢印をクリックすると機能しますが、タイトル行をクリックすると2回のクリックでしか開きません。

私はすでにドキュメントでそれに関する情報を見つけようとしましたが、何も見つけることができません。

これはドキュメントの例です。 https://ag-grid.com/javascript-grid-tree/index.php

サンプル画像: enter image description here

8
Pedro

行またはセルをクリックしてイベントをリッスンし、それに応じてノードを展開できます。

たとえば、クリックに基づいて行を展開するには、次のようにします。

onRowClicked: (params) => {
    // update the node to be expanded
    params.node.expanded = true; 
    // tell the grid to redraw based on state of nodes expanded state 
    gridOptions.api.onGroupExpandedOrCollapsed(params.rowIndex)
}

これはドキュメントにあるはずです。この情報を反映するように更新します。

6
Sean Landsman

onGroupExpandedOrCollapsedを使用しないことをお勧めしますので、これは...

これにより、アイコンが更新されて行がアニメーション化されますが、onGroupExpandedOrCollapsedでは更新されません。

_onRowClicked(params) {
    params.node.setExpanded(!params.node.expanded);
}
_

これは展開を切り替えます。行を開いたままにする場合はparams.node.setExpanded(true)を使用します。

4
AliS

列定義 では、onCellClicked(params)関数を使用して、セルがクリックされたときに何かを実行するように指示できます。私は展開関数を探してみましたが、あなたが望んでいるとは思えないexpandAll()しか見つかりませんでした。だから私がやろうとしていることは、jqueryまたは単純なDOM選択を使用して、そのセル内の展開アイコンをクリックすることです。

1
Jarod Moser

これはうまくいく

 onRowClicked(params) { 
    params.context.setExpand.onExpandClicked(params.rowIndex, params.node.rowHeight);
  }
0
gabibrk