I'm using a script to write a dataset to the data property of a table. The columns are for a name, setpoint, and actual value, and I'd like the name column to be bigger than the other two. However, when I add columns to the columns property and try to change the width, nothing happens. I assumed this was because those columns were written from a script, but I added a 4th, blank column and still can't resize it. Not sure why columns.0.width doesn't change the width of column 0.
Unless you check strictWidth, then width is treated as a value relative to the value set for other columns.
I did it with strictWidth both checked and unchecked, and it made no difference
You might want to make sure that the field property matches exactly with your column name. I'm pretty sure it's case sensitive
1 Like
That didn't seem to work either
Right-click on the table, copy, paste in here and format it properly. See Wiki - how to post code on this forum. We can then check it out.
[
{
"type": "ia.display.table",
"version": 0,
"props": {
"data": {
"$": [
"ds",
192,
1746456718847
],
"$columns": [
{
"name": "MaterialName",
"data": [
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
"",
""
],
"type": "String"
},
{
"name": "Setpoint",
"data": [
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0
],
"type": "Double"
},
{
"name": "Actual",
"data": [
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0
],
"type": "Double"
}
]
},
"selection": {
"enableRowSelection": false
},
"columns": [
{
"field": "",
"visible": true,
"editable": false,
"render": "auto",
"justify": "auto",
"align": "center",
"resizable": false,
"sortable": true,
"sort": "none",
"filter": {
"enabled": false,
"visible": "on-hover",
"string": {
"condition": "",
"value": ""
},
"number": {
"condition": "",
"value": ""
},
"boolean": {
"condition": ""
},
"date": {
"condition": "",
"value": ""
}
},
"viewPath": "",
"viewParams": {},
"boolean": "checkbox",
"number": "value",
"progressBar": {
"max": 100,
"min": 0,
"bar": {
"color": "",
"style": {
"classes": ""
}
},
"track": {
"color": "",
"style": {
"classes": ""
}
},
"value": {
"enabled": true,
"format": "0,0.##",
"justify": "center",
"style": {
"classes": ""
}
}
},
"toggleSwitch": {
"color": {
"selected": "",
"unselected": ""
}
},
"nullFormat": {
"includeNullStrings": false,
"strict": false,
"nullFormatValue": ""
},
"numberFormat": "0,0.##",
"dateFormat": "MM/DD/YYYY",
"width": "100px",
"strictWidth": true,
"style": {
"classes": ""
},
"header": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
},
"footer": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
}
},
{
"field": "",
"visible": true,
"editable": false,
"render": "auto",
"justify": "auto",
"align": "center",
"resizable": true,
"sortable": true,
"sort": "none",
"filter": {
"enabled": false,
"visible": "on-hover",
"string": {
"condition": "",
"value": ""
},
"number": {
"condition": "",
"value": ""
},
"boolean": {
"condition": ""
},
"date": {
"condition": "",
"value": ""
}
},
"viewPath": "",
"viewParams": {},
"boolean": "checkbox",
"number": "value",
"progressBar": {
"max": 100,
"min": 0,
"bar": {
"color": "",
"style": {
"classes": ""
}
},
"track": {
"color": "",
"style": {
"classes": ""
}
},
"value": {
"enabled": true,
"format": "0,0.##",
"justify": "center",
"style": {
"classes": ""
}
}
},
"toggleSwitch": {
"color": {
"selected": "",
"unselected": ""
}
},
"nullFormat": {
"includeNullStrings": false,
"strict": false,
"nullFormatValue": ""
},
"numberFormat": "0,0.##",
"dateFormat": "MM/DD/YYYY",
"width": "5px",
"strictWidth": true,
"style": {
"classes": ""
},
"header": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
},
"footer": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
}
},
{
"field": "",
"visible": true,
"editable": false,
"render": "auto",
"justify": "auto",
"align": "center",
"resizable": true,
"sortable": true,
"sort": "none",
"filter": {
"enabled": false,
"visible": "on-hover",
"string": {
"condition": "",
"value": ""
},
"number": {
"condition": "",
"value": ""
},
"boolean": {
"condition": ""
},
"date": {
"condition": "",
"value": ""
}
},
"viewPath": "",
"viewParams": {},
"boolean": "checkbox",
"number": "value",
"progressBar": {
"max": 100,
"min": 0,
"bar": {
"color": "",
"style": {
"classes": ""
}
},
"track": {
"color": "",
"style": {
"classes": ""
}
},
"value": {
"enabled": true,
"format": "0,0.##",
"justify": "center",
"style": {
"classes": ""
}
}
},
"toggleSwitch": {
"color": {
"selected": "",
"unselected": ""
}
},
"nullFormat": {
"includeNullStrings": false,
"strict": false,
"nullFormatValue": ""
},
"numberFormat": "0,0.##",
"dateFormat": "MM/DD/YYYY",
"width": "5px",
"strictWidth": true,
"style": {
"classes": ""
},
"header": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
},
"footer": {
"title": "",
"justify": "left",
"align": "center",
"style": {
"classes": ""
}
}
}
],
"dragOrderable": false,
"rows": {
"height": "38px"
},
"pager": {
"options": [
15
],
"activeOption": 15
}
},
"meta": {
"name": "Table"
},
"position": {
"grow": 1,
"basis": "400px"
},
"custom": {},
"propConfig": {
"custom.maxRows": {
"binding": {
"config": {
"path": "this.props.data"
},
"transforms": [
{
"code": "\treturn value.getRowCount()",
"type": "script"
}
],
"type": "property"
}
},
"custom.rowFirst": {
"binding": {
"config": {
"expression": "(({this.props.pager.activePage} -1) *{this.props.pager.activeOption}) +1"
},
"type": "expr"
}
},
"custom.rowLast": {
"binding": {
"config": {
"expression": "toInt(min({this.custom.maxRows},\r\n ({this.props.pager.activePage}*{this.props.pager.activeOption})))"
},
"type": "expr"
}
}
},
"events": {
"system": {
"onStartup": {
"type": "script",
"scope": "G",
"config": {
"script": "\tarray = \"Ingredients\"\n\tsize = 30\n\tmembers = [\"MaterialName\", \"Setpoint\", \"Actual\"]\n\tdevice = self.session.custom.tagFolder\n\t\n\tself.props.data = scripts.tag.udtArrayToDataSet(array, size, members, device)"
}
}
}
}
}
]
The event script is taking the tagname from the PLC, taking it's UDT elements, and turning that into a dataset type for the table.
You need to fill in field with the column name.
1 Like
Like I said in response to vtran, that didn't seem to make a difference. I just don't have them typed in on the code snippet I sent.
It may not be the only reason, but I'm pretty sure you won't get it to work if you don't include them.
1 Like
Can you click on the dataset editor button to the right of your table's props.data and take a screenshot like this? Remove every object from props.columns, add a new object to it, and set the field value to any of the column names as shown in your dataset editor ensuring that the case matches.
It definitely won't work without the field names being properly specified.
When strictWidth : true it's expecting width : integer. You're providing a string, 100px. Remove the px
It's in Perspective - Table | Ignition User Manual but way down in columns.
- width: The width of this column. If resize is enabled, specifies the column width on initial load. User can override this in the runtime if the Resizable option is enabled. Value is numeric.
If you set strictWidth : false then the width determines the proportional width of each column. e.g. 10, 15, 25 (which sums to 50) would allocate 20%, 30% and 50% of the table width to the respective columns.
4 Likes
That was it. Removed the px and now it resizes (with the field names). Thanks!