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
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
Hi Vera,
As you suggested it is working fine, we're good with that approach.
Thank you.
Regards,
Ravi
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
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