whether devexpress GridControl Component can use the first column as index name - devexpress-windows-ui

I'm new to Devexpress and windows desktop program,now I have to to dispaly the json data , below is the format
{
"op": "etf_info"
"data": {
"up_l": 100,
"down_l": 100,
"halt": 100,
"est_dif": 123,
“create_iopv”: 1.5991,
"create_limit": 100,
"redeem_iopv": 1.6992,
"redeem_num": 200,
}
}
and the name of each filed are required to be put at the first column, the next column display the data, because of the layout of components inside the mainform.
I'm trying GridControl but don't how to set it or whether it could word like that.
I do need your help~

you need to access gridview from gridcontrol like this:
GridView gridview = ((GridView) gridcontrol.FocusedView);
and use this loop
foreach (GridColumn item in gridView.Columns)
{
if (item == gridView1.Columns["<SomeColumnName>"])
{
//............
}
}
you can get more information in:
https://supportcenter.devexpress.com/ticket/details/t247992/how-to-find-a-column-in-the-gridcontrol
I hope you got help.
Thank you.

Related

Get the entire row's data inside a cell in AgGrid

I'm using AgGridReact, but this is a general question about how to get the entire row's data inside a cell in that row using AgGrid.
I'm using a custom cell renderer for a certain cell (whose field is id) in which I need to get the entire row's data and not just the id field's data.
This is how the grid is defined:
<AgGridReact
rowData={users}
frameworkComponents={{
idRenderer: IdRenderer,
}}
>
<AgGridColumn field="id" cellRenderer="idRenderer"></AgGridColumn>
<AgGridColumn field="name"></AgGridColumn>
<AgGridColumn field="phone"></AgGridColumn>
<AgGridColumn field="email"></AgGridColumn>
</AgGridReact>
Here's the IdRender component (used to customize the look of the id field's cell) where I need to get the row's data:
import { useEffect } from 'react';
function IdRenderer(props) {
// the following currently stores the cell's value in `rowData`
const rowData = props.valueFormatted ? props.valueFormatted : props.value;
useEffect(() => {
console.log(rowData); // get the entire row's data here instead of just this cell's value
}, [])
return (
<>
{/* some components */}
</>
);
}
export default IdRenderer;
I'm not able to figure out from the docs what should I add to the grid or the cell renderer to be able to get the entire row's data inside the id field's cell (where I'll be posting the data to an API on a button click).
After digging through the docs for a long time I finally found the way to achieve this: using a valueGetter. I decided to post this Q&A to help others in figuring out how to achieve the same.
Just define the following value getter for the row's data:
const rowDataGetter = function (params) {
return params.data;
};
and use it on the AgGridColumn by setting the valueGetter prop:
<AgGridColumn field="id" cellRenderer="idRenderer" valueGetter={rowDataGetter}></AgGridColumn>
Now rowData in IdRenderer will contain the entire row's data instead of the cell value.

AgGrid: How to change the aggregate values for some of the columns dynamically at run time?

I am using Ag grid's row grouping feature and for some of the columns I have predefined aggFunc.
What I am trying to achieve is that once the grid is loaded with all the data, I want to hide some of the aggregate values (on row as well as leaf children) for some columns based on some conditions.
I checked AgGrid's API docs and tried below but unfortunately nothing works for me.
onButtonClick() {
this.gridApi.forEachNode((node, index) => {
if (node.field === 'xyz') {
// node.aggFunc.abc = 0; // not working
// node.aggData.abc = null; // not working
// node.setDataValue('abc', null); // not working
}
}
}
Any help would be appreciated.
Thanks
try this
columnApi.setColumnAggFunc(colKey, () => '')

ag-grid - how to get parent node from child grid via context menu?

As an example, I have a Master\Detail grid.
Master\Detail defined as key-relation model and on getDetailRowData method parent node data exists in params
but how to get parent node data from child view?
Tried via context-menu:
On right click - getContextMenuItems got executed which has an input params
On this sample, child-grid doesn't have any row and node in context-params is null, it's ok,
but anyway it should be possible to retrieve the parent details at least via grid API, isn't it ?
Then I've tried to get parent via node:
but instead of detail_173 as you can see its ROOT_NODE_ID, and here is a confusion for me.
So question is that how to get parent node data (RecordID 173 just in case) through child-view context menu or any other possible way (without storing temp value, cuz multiple children's could be opened at the same time)
Yes, I've read this part Accessing Detail Grid API, and still unclear how to get parent-node via child-grid.
For React Hook users without access to lifecycle methods, use Ag-Grid Context to pass the parent node (or parent data) to the detail grid via detailGridOptions. No need to traverse the DOM or use a detailCellRenderer unless you want to :)
https://www.ag-grid.com/javascript-grid-context/
detailCellRendererParams: (masterGridParams) => ({
detailGridOptions: {
...
context: {
masterGrid: {
node: masterGridParams.node.parent,
data: masterGridParams.data
}
},
onCellClicked: detailGridParams => {
console.log(detailGridParams.context.masterGrid.node);
console.log(detailGridParams.context.masterGrid.data);
}
}
})
Able to achieve it. Have a look at the plunk I've created: Get master record from child record - Editing Cells with Master / Detail
Right click on any child grid's cell, and check the console log. You'll be able to see parent record in the log for the child record on which you've click.
The implementation is somewhat tricky. We need to traverse the DOM inside our component code. Luckily ag-grid has provided us the access of it.
Get the child grid's wrapper HTML node from the params - Here in the code, I get it as the 6th element of the gridOptionsWrapper.layoutElements array.
Get it's 3rd level parent element - which is the actual row of the parent. Get it's row-id.
Use it to get the row of the parent grid using parent grid's gridApi.
getContextMenuItems: (params): void => {
var masterId = params.node.gridOptionsWrapper.layoutElements[6]
.parentElement.parentElement.parentElement.getAttribute('row-id');
// get the parent's id
var id = masterId.replace( /^\D+/g, '');
console.log(id);
var masterRecord = this.gridApi.getRowNode(id).data;
console.log(masterRecord);
},
defaultColDef: { editable: true },
onFirstDataRendered(params) {
params.api.sizeColumnsToFit();
}
Note: Master grid's rowIds are defined with [getRowNodeId]="getRowNodeId" assuming that account is the primary key of the parent grid.
A very reliable solution is to create your own detailCellRenderer.
on the init method:
this.masterNode = params.node.parent;
when creating the detail grid:
detailGridOptions = {
...
onCellClicked: params => console.log(this.masterNode.data)
}
Here is a plunker demonstrating this:
https://next.plnkr.co/edit/8EIHpxQnlxsqe7EO
I struggled a lot in finding a solution to this problem without creating custom details renderer but I could not find any viable solution. So the real good solution is already answered. I am just trying to share another way to avoid creating custom renderer.
So What I did is that I changed the details data on the fly and added the field I required from the parent.
getDetailRowData: function (params: any) {
params?.data?.children?.forEach((child:any) => {
//You can assign any other parameter.
child.parentId= params?.data?.id;
});
params.successCallback(params?.data?.children);
}
When you expand the row to render details the method getDetailRowData gets called, so it takes in params as the current row for which we are expanding the details and the details table is set by invoking params.successCallback. So before setting the row data I am iterating and updating the parentId.

GWT DataGrid specific row needs add style

is anyone have idea ,how to add specific style to GWT Datagrid?
I need to add style to specific row ( class="error") to show that row in red color.
More details:
Rendering the table using the GWT Datagrid. it has column called "type" .
the type can have different values like " connected" ,"disconnected" ,"error".
if the type is error then i need to render row with different style( need to show text in the
red color).
There's RowStyles for that exact purpose.
grid.setRowStyles(new RowStyles<Row>() {
#Override
public String getStyleNames(Row row, int rowIndex) {
return "error".equals(row.getType()) ? "error" : "";
}
});

How to set default value for FilteringSelect widget in Dojo Data Grid?

I am trying to display dynamic values read for a store as options within a filteringSelect widget in my DOJO Data Grid. The values are getting populated as expected however, I am unable to display a default value when the grid loads, right now it shows up as "..." on single click, I am able to see a drop down.
Below is the location of the sample code:
http://jsfiddle.net/R64bE/2/
I want to iterate through my "myStore" in the code above and make the item with label = 'Y' as the default for that filteringSelect.
I want the default value displayed as soon as the grid or filtering select is rendered. Any pointers or sample code will be of great help.
Glad that I was able to fixed it too..Below is the code in case anyone wants to achieve something similar.
Working code with Default value
Basically all I had to do was send a default value for that field/cell in the first json I created.
jsonStore = new dojo.data.ItemFileWriteStore({
data: {
"identifier": "identify",
"label": "description",
"items": [
{
"identify": 123,
"description": "Project Manager",
"billingMethod":"Sample"},
{
"identify": 234,
"description": "Developer"},
{
"identify": 536,
"description": "Developer"}
]
}
});
Notice that all I had to do was add a value for that column in the json, i.e., for Billing Method Column, I added "billingMethod":"Sample" and it picks it up from there.
Cheers