We have updated Flexmonster Software License Agreement, effective as of September 30, 2024. Learn more about what’s changed.

Hide Columns from both Grid and Fields List

Answered
Ravi Kumar asked on July 5, 2021

Hi,
 
We're trying to implement a dynamic solution based on our input selections, for that we need to hide specific columns from both Grid and Fields List according to selected inputs.
I tried an approach from a forum question to hide Columns but it is hiding from Grid and showing those hidden columns for selection in Fields.
But for our scenario Data is standard and based on input selection need to hide columns from Grid and from Fields list (we should not show those hidden columns to user).

Please suggest any approach.
I'm sharing you my data and expected scenario, Kindly check and provide a solution.
 
DATA:
[
{
"Job_Code": "INR18",
"Job_Desc": "Indian Job 18",
"Unit_Weight": 20.02,
"Dimension_Type": "Meter",
"Category_Code": "INRLE",
"Category_Desc": "Indian Job Leo"
},
{
"Job_Code": "INR17",
"Job_Desc": "Indian Job 17",
"Unit_Weight": null,
"Dimension_Type": null,
"Category_Code": "INRLK",
"Category_Desc": "Indian Job Kat"
}
]
Selected Input - "Job" : Need to show only Job_Code, Job_Desc columns and hide all other columns from both Grid and Fields List.
Selected Input - "Category" : Need to show only Category_Code, Category_Desc
Selected Input - "All" : Need to show all data columns
 
Regards,
Ravi

4 answers

Public
Vera Didenko Vera Didenko Flexmonster July 5, 2021

Hello, Ravi,
 
Thank you for writing to us.
 
The simplest solution to hide certain columns would be to use the "visible: false" property in the mapping object.
For example:

report: {
dataSource: {
type: "json",
data: getData(),
mapping: {
"Job_Code": {
type: "string",
visible: false
},
"Job_Desc": {
type: "string",
visible: false
},
"Unit_Weight": {
type: "number"
},
"Dimension_Type": {
type: "string"
},
"Category_Code": {
type: "string"
},
"Category_Desc": {
type: "string"
}
}
},
...
}

When the input value changes, you can use the connectTo() or setReport() API call to update the mapping object accordingly.
We have prepared a simple JSFiddle for illustration: https://jsfiddle.net/flexmonster/15awc83m/.
 
Please let us know if this works.
 
Kind regards,
Vera

Public
Ravi Kumar July 8, 2021

Hi Vera,
As you suggested it is working fine, we're good with that approach.
Thank you.
 
Regards,
Ravi

Public
maryam August 22, 2024

Hello, 
I hope you're doing great. 

I need to do so (unchecked a field in the fields list by default) with my JSON data. but "visible: false" removes the columns at all. it event doesn't exist in the field list. Is there any other solution?
I added rows in the configuration, all the rows except the one I want to make uncheck by default. it worked, but the issue is we have some dynamic columns that are added to the table by applying some filter and they will missed in the configuration. 

 

Thanks in advance

Public
Nadia Khodakivska Nadia Khodakivska Flexmonster August 23, 2024

Hello Maryam,

Thank you for reaching out to us.

Kindly note that all checked fields are defined in the slice property of the Report Object. For example:

report: {
// other properties
slice: {
columns: [{
uniqueName: "Category"
},
{
uniqueName: "[Measures]"
}
],
rows: [{
uniqueName: "Color"
}],
measures: [{
uniqueName: "Price"
}]
},
}

Feel free to check the following JSFiddle: https://jsfiddle.net/flexmonster/dtyngbLx/. The idea is to edit the slice object to remove the necessary fields from rows , columns or measures arrays. This way, the field will still be available in the Field List.

Please let us know if it works for you. Looking forward to hearing from you.

Kind regards,
Nadia

Please login or Register to Submit Answer