Ag-Grid 更新值推送? [英] Ag-Grid updating values pushed?
本文介绍了Ag-Grid 更新值推送?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
制作 ag-grid,为点击创建事件以将点击的数据(以及对它的一些操作)添加到第二个网格.
检查行数据时会推送值,但不显示.
如何更新第二个表?下面的代码,请&谢谢!!
//指定第一个表的列var columnDefs = [{headerName:Col1",字段:Col1"},{headerName:Col2",字段:Col2"},{headerName:Col3",字段:Col3"}];//指定第一个表的数据var rowData = [{ Col1:25",Col2:7.25",Col3:1"},{ Col1:5",Col2:7.5",Col3:3"},{ Col1:13",Col2:7.75",Col3:7"},];//网格选项第一个表var gridOptions = {columnDefs: columnDefs,行数据:行数据,行选择:'单',抑制MovableColumns:真,};//查找我们希望 Grid 使用的容器var eGridDiv = document.querySelector('#myGrid');//创建传入 div 的网格以与列一起使用 &我们要使用的数据新的 agGrid.Grid(eGridDiv, gridOptions);//添加监听器gridOptions.api.addEventListener('rowClicked', myRowClickedHandler);//保存第二个网格数据的变量var a = [];var columnDefs2 = [{headerName:TIMESCLICKED",字段:TimesClicked"},{headerName:ATT1",字段:Att1"},{headerName:ATT2",字段:Att2"}];var gridOptions2 = {columnDefs: columnDefs2,抑制MovableColumns:真,行数据:一个,}var eGridDiv2 = document.querySelector('#mySecondGrid');new agGrid.Grid( eGridDiv2, gridOptions2);//是否应该通过传递来自第一个网格中点击的项目的数据而不更新来更新第二个网格?函数 myRowClickedHandler(event) {a.push({TimesClicked: 1, Att1: gridOptions.api.getSelectedNodes()[0].data.Col1, Att2: gridOptions.api.getSelectedNodes()[0].data.Col2})} 解决方案 你应该设置行数据 -->gridOptions2.api.setRowData(a)
在你把对象放到你的 'a' 变量之后.
https://plnkr.co/edit/mPJQpms0X6PlqRRy
Made ag-grid, created event for click to add that clicked data (and some manipulations of it) to a second grid.
Values get pushed, when checking row data, but does not display.
How can I make the second table update ? Code below, please & Thank you!!
<div id="myGrid" style="height: 1000px; width:1000px;" class="ag-theme-alpine-dark"></div>
<div id="mySecondGrid" style="height: 100rem;width:100rem;" class="ag-theme-alpine-dark"></div>
<script type="text/javascript" charset="utf-8">
// specify the columns for first table
var columnDefs = [
{headerName: "Col1", field: "Col1"},
{headerName: "Col2", field: "Col2"},
{headerName: "Col3", field: "Col3"}
];
// specify the data for first table
var rowData = [
{ Col1:"25",Col2:"7.25",Col3:"1"},
{ Col1:"5",Col2:"7.5",Col3:"3"},
{ Col1:"13",Col2:"7.75",Col3:"7"},
];
// grid options first table
var gridOptions = {
columnDefs: columnDefs,
rowData: rowData,
rowSelection: 'single',
suppressMovableColumns:true,
};
// lookup the container we want the Grid to use
var eGridDiv = document.querySelector('#myGrid');
// create the grid passing in the div to use together with the columns & data we want to use
new agGrid.Grid(eGridDiv, gridOptions);
//add Listener
gridOptions.api.addEventListener('rowClicked', myRowClickedHandler);
//Variable to hold data for second grid
var a = [ ];
var columnDefs2 = [
{headerName: "TIMESCLICKED", field: "TimesClicked"},
{headerName: "ATT1", field: "Att1"},
{headerName: "ATT2", field: "Att2"}
];
var gridOptions2 = {
columnDefs: columnDefs2,
suppressMovableColumns:true,
rowData: a,
}
var eGridDiv2 = document.querySelector('#mySecondGrid');
new agGrid.Grid( eGridDiv2, gridOptions2);
//should update second grid by passing data from items clicked on in first grid not updating ?
function myRowClickedHandler(event) {
a.push({TimesClicked: 1, Att1: gridOptions.api.getSelectedNodes()[0].data.Col1, Att2: gridOptions.api.getSelectedNodes()[0].data.Col2})
}
</script>
解决方案 You should set the row data --> gridOptions2.api.setRowData(a)
after you pused the object to your 'a' variable.
https://plnkr.co/edit/mPJQpms0X6PlqRRy
这篇关于Ag-Grid 更新值推送?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文