How to hide column based on value of column data, is this the correct approach?

[mkramer]

Hi,

I need to hide a column if there is no data returned in the first record of that column. Below is a code snippet of my datasource using showIf with a function call that needs to look at the returned dataset to determine if the column should be shown.

My problem is that I don't know if this is the correct approach to accomplish this, and if so, don't know how to access the data on this column to test if it has a value?

Can you point to an example or give me a short code snippet to get me going?

The datasource is feeding a listGrid.

isc.RestDataSource.create({
fetchDataURL: "/listPMF",
addDataURL: "/createPMF",
updateDataURL: "/updatePMF",
removeDataURL: "/removePMF",
dataFormat: "json",
allowAdvancedCriteria: true,
ID: "shopProdRestDataSource",
fields: [
{ name: "id", title: "id", primaryKey: true, hidden: true, },
{ name: "src", title: "Image", type: "image", align: "center", canEdit: false, width: 85, imageWidth: 80, imageHeight: 80, },
{ name: "title", title: "Title", canEdit: false, width: 230 },
{ name: "key_3", title: "Customer Tag", canEdit: false, width: 100, showIf: function(){return true} },
]
}

[mkramer]

Here is the solution I came up with in case anyone else has a similar question...

This will hide the columns if there is no data in the column field on the first row.

isc.ListGrid.create({
ID: "shopProdListGrid",
width: "100%",
height: "95%",
alternateRecordStyles: true,
sortField: 1, 
dataPageSize: 30,
drawAheadRatio: 4,
listEndEditAction: "next",
autoSaveEdits: true,
autoFetchData: true,
confirmDiscardEdits: true,
canSelectAll: false,
dataSource: shopProdRestDataSource,
editEvent: "click",
selectCellTextOnClick: true,
dataArrived: function(startRow, endRow){
//Get the column values from the forst row
var { value_0, value_1, value_2, value_3, value_4 } = shopProdListGrid.getCellRecord(startRow);
if (!value_0) {
shopProdListGrid.hideField("key_0");
shopProdListGrid.hideField("value_0");
}
if (!value_1) {
shopProdListGrid.hideField("key_1");
shopProdListGrid.hideField("value_1");
}
if (!value_2) {
shopProdListGrid.hideField("key_2");
shopProdListGrid.hideField("value_2");
}
if (!value_3) {
shopProdListGrid.hideField("key_3");
shopProdListGrid.hideField("value_3");
}
if (!value_4) {
shopProdListGrid.hideField("key_4");
shopProdListGrid.hideField("value_4");
}
     },
});

[Isomorphic]

Yes, the property is copied to the ListGridField, where it would be valid. It remains invalid to specify it on a DataSourceField, where it is not documented. Because all DataBoundComponents use the DataSourceField definition, surprising and unsupported things would happen as the property is applied differently in each DataBoundComponent.

[mkramer]

That is very strange because I tested the above and it does indeed hide/show the column based on returning true/false to showIf...

Thanks for the guidance!

[Isomorphic]

There is no DataSourceField.showIf() property, so this code is invalid.

The right way to do this is to use the callback from the ListGrid.fetchData() method, inspect the data and then call hideField() if necessary.