Table - Hide a column in perspective

Hello :slight_smile:

I’m trying to work on a table in perspective, and I have the data binded to a named query but I need some columns hidden. Is there a way to hide them in perspective? Thank you

Use the columns property to do this.

  1. Add a new column configuration for each column you want to display.
  2. Set props.columns[x].field to the case-sensitive name of the column of data you want represented. If using a dataset, this value should be a case-sensitive match of the header of the DataSet column.

Using the default data in the table as an example, let’s say that I only want to display columns for “city” and “population” - I do NOT want to display “country” as a column.

Steps:

  1. Add two column configurations, because I want two columns.
  2. Set props.columns[0].field to have a value of “city”.
  3. Set props.columns[1].field to have a value of “population”.
1 Like

You’re awesome. Thank you!

1 Like
  1. Add two column configurations, because I want two columns.

is there a way to add these columns using a script?
i am asking because when i am displaying historic datasets from several tags the number of columns obviously will change.
I need to add appropriate number of columns otherwise having just 1 column[0].field = 't_stamp' will not allow the table to display the rest of the data.
What i dont understand is how come when no columns configuration data was created the date time in epoch time was displayed along with the rest of the data :frowning:

You can do anything in scripting, it just takes longer as you add more complications/requirements.

Because that's how the date information is stored and returned. If you want it formatted, you need to specify a format string, which means you need to define a column for that information to live in.

1 Like

You could write a project script that you pass the table data into and it grabs the column names and generates the column configuration object for you. Generate the 't_stamp' config first so it always sits on the left of the table. You then put the generated column configuration object in the table's props.columns.

Something like this should get you started on the script side. This script assumes you are passing a list of column names or the table data as a dataset.

def defaultTableColumnConfig():

	baseColumnConfig = {
		"align": "center",
		"boolean": "checkbox",
		"dateFormat": "MM/DD/YYYY",
		"editable": False,
		"field": "",
		"footer": {
			"align": "center",
			"justify": "left",
			"style": {
				"classes": ""
			},
			"title": ""
		},
		"header": {
			"align": "center",
			"justify": "left",
			"style": {
				"classes": ""
			},
			"title": ""
		},
		"justify": "auto",
		"number": "value",
		"numberFormat": "0,0.##",
		"progressBar": {
			"bar": {
				"color": "",
				"style": {
					"classes": ""
				}
			},
			"max": 100,
			"min": 0,
			"track": {
				"color": "",
				"style": {
					"classes": ""
				}
			},
			"value": {
				"enabled": True,
				"format": "0,0.##",
				"justify": "center",
				"style": {
					"classes": ""
				}
			}
		},
		"render": "auto",
		"resizable": True,
		"sort": "none",
		"sortable": True,
		"strictWidth": False,
		"style": {
			"classes": ""
		},
		"toggleSwitch": {
			"color": {
				"selected": "",
				"unselected": ""
			}
		},
		"viewParams": {},
		"viewPath": "",
		"visible": True,
		"width": ""
	}

	return baseColumnConfig


def generateWideTableColumnConfig(columnData, codes=None):

	if isinstance(columnData, list):
		columnNames = columnData
	else:
		columnNames = columnData.getColumnNames()

	columnConfig = []
	columnCount = 0

	for item in columnNames:
		tmpDict = defaultTableColumnConfig()
		if item == 't_stamp':
			tmpDict.update({
				"field": "t_stamp",
				"justify": "center",
				"style": {
					"paddingLeft": "5px",
					"paddingRight": "5px"
				},
				"sortable": True,
				"header": {
					"title": "Timestamp",
					"justify": "center"
				}
			})
		else:
			title = item
			if columnCount % 2:
				backgroundColor = ''
			else:
				backgroundColor = "#005EB833"

			tmpDict.update({
				"field": item,
				"justify": "center",
				"header": {"title": title,  "justify": "left"},
				"sortable": False,
				"strictWidth": True,
				"width": 72,
				"style": {"wordBreak": "break-word", "backgroundColor": backgroundColor}
			})
			columnCount += 1

		columnConfig.append(tmpDict)

	return columnConfig

3 Likes

massive thanks

1 Like

wow wow wow
i pretty much copy pasted your code and ....it works
i was sitting on this problem for the last several hours - thank you

@ryan.white i will have some beer now and analyze this code again tomorrow :slight_smile: - its 11pm at my place
Your code did exactly what i needed but i wonder why after writing the config to the columns property the changes are not shown ? Trying to understand perspective bit by bit...
image

How did you execute the code ?

For dynamic column configuration, I usually bind the columns property to the dataset, and use its headers to get the column names.

1 Like
def runAction(self, event):
	SelectedTagList = self.getSibling("TagBrowseTree").props.selection.values
	endTime = system.date.now()
	startTime = system.date.addMinutes(endTime, -1)

	dataSet = system.tag.queryTagHistory(paths=SelectedTagList, startDate=startTime, endDate=endTime, returnSize=5, aggregationMode="Maximum", returnFormat='Wide')																																				

	self.parent.parent.getChild("Table").props.columns = Perspective.generateWideTableColumnConfig(dataSet)
	self.parent.parent.getChild("Table").props.data= dataSet

this is the code behind the button to add the history of the selected tags to the table,
original dataset was then modified by the perspective.generateWideTableColumnConfig project function using the example from the previous post.
The difficulty for me was to make the code work for any number of tags rather than fixed preselected number.

Considering this code should indeed add things to the columns property, I can think of several answers to 'why is there nothing in the columns property ?':

  • The most obvious one: You tested the functionality, then checked the property outside of the test run.
    ie: you clicked the button in a browser, then checked the property in the designer.
    or you clicked in the designer's preview, then stopped it and checked the property after something cleared it.
  • The code stopped executing because of an error (check the logs)
  • The code worked but returned an empty list, because of a logic error.
1 Like

I'd also like to add that you should probably move this to a binding on the columns property, instead of handling it on a button click.

1 Like

yep you were right
i closed perspective workstation and used only designer
after running the code i deep selected different object and then deep selected the table
the columns are shown now
i feel better about my sanity now :slight_smile:

very interesting pointer but to be honest i dont know how to do it :frowning:
how would it work in theory ? are binding preferred in general for some reason if possible?

at the moment button code takes selected tags from tree browse, queries the history of each tag,
then calls the project function to modify the column to display the time in human readable format and then assigns modified dataset to the table.data property

When configuring the code in binding i am limited to the expression languagae only - (except runscript function which can be embedded in the expression and run either system function or project code)

Bindings in perspective allow you to apply a script transform, which would allow you to write a normal python script.

An example binding would be to bind the columns property to the data property of the table, apply a script transform, and then call the function to generate the columns configuration.

Example Binding

2 Likes

excellent example - thank you