# 1st column width via script

**URL:** <https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [May 27, 2025, 3:22pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731 "2025-05-27T15:22:45Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 27, 2025, 3:22pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/1 "2025-05-27T15:22:45Z")

</div>

Is there a way to change the width of the first column of a table via script.  
I would like to do this as the number of columns is dinamic but the first one is constant.

Any ideas welcome.  
Cheers!

---

<div class="post-metadata">

**Author:** ![dillon](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dillon/32/81537_2.png) [@dillon](https://forum.inductiveautomation.com/u/dillon)\
**Post date:** [May 27, 2025, 3:27pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/2 "2025-05-27T15:27:09Z")

</div>

Modify the width property for that column. See below.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/9/4967dd3d75d4730f14eb488af806b7f1320aa2b6.png)

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 27, 2025, 3:30pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/3 "2025-05-27T15:30:25Z")

</div>

Thanks @dillon ,Yes, I was thinking to do it there...but as the number of columns are dinamic depending on the current month of the year I can´t hardcode a number of columns.

---

<div class="post-metadata">

**Author:** ![dillon](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dillon/32/81537_2.png) [@dillon](https://forum.inductiveautomation.com/u/dillon)\
**Post date:** [May 27, 2025, 3:31pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/4 "2025-05-27T15:31:39Z")

</div>

Once the number of columns is known in the script you could modify the **columns** array property to have the correct number of objects appended after the static first column.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 27, 2025, 3:32pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/5 "2025-05-27T15:32:18Z")

</div>

Ooo, I didn´t know this, thanks!, I will give it a try.

---

<div class="post-metadata">

**Author:** ![dillon](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dillon/32/81537_2.png) [@dillon](https://forum.inductiveautomation.com/u/dillon)\
**Post date:** [May 27, 2025, 3:34pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/6 "2025-05-27T15:34:09Z")

</div>

_Insert my advice was not tested disclaimer here_

Seems reasonable to me from past experiences. If you just have the first static column defined in the designer and then use scripting to append to the list, it will show what you need but will not persist.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 27, 2025, 3:34pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/7 "2025-05-27T15:34:53Z")

</div>

ok, time for me to go home, I give it a try tomorrow, thanks!

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [May 27, 2025, 3:46pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/8 "2025-05-27T15:46:00Z")

</div>

Put a change script on the 'columns' property, check the length of the array, update `columns[0]['width']` if the length is \> 1.

---

<div class="post-metadata">

**Author:** ![Bastian\_Ignacio](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bastian_ignacio/32/43245_2.png) [@Bastian\_Ignacio](https://forum.inductiveautomation.com/u/Bastian_Ignacio)\
**Post date:** [May 27, 2025, 4:05pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/9 "2025-05-27T16:05:57Z")

</div>

I share this:

If you need know exact index number of columns on a table i do this Object (dic):

```python
--Expresion Binding:
 {./flex_tabla/tbl_listado.props.columns} (Here is my Table component with JSON return format)

--Transform Script:
def transform(self, value, quality, timestamp):

    column_indices = {}

    #Recorrer filas de col.
    for index, column in enumerate(value):
        # Agregar el nombre del campo ('field') y su indice al dic
        field_name = column.get("field", None)
        if field_name: # Verificar que exista valor para 'field'
           column_indices[field_name] = index

    #Devolver el diccionario que contiene los campos y sus índices
    return column_indices

```

And here is, how i know always the exact index of column, sure there's another way, but it's worked quite well for me 🙂 .

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [May 27, 2025, 7:34pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/10 "2025-05-27T19:34:50Z")

</div>

That looks like a good candidate for a comprehension:

```python
def transform(self, value, quality, timestamp):
    return {col['field']: i for i, col in enumerate(value) if col.get('field')}

```

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 27, 2025, 10:24pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/11 "2025-05-27T22:24:15Z")

</div>

I don't know if this will help:

If `columns.x.strictWidth : true` then `column.x.width = 120` sets that column to 120 pixels wide.

If `columns.x.strictWidth : false` then `column.x.width` sets width of that column **relative to the width of the other `strictWidth = false` columns** in the remaining available space.

```python
| <------------------------ table width --------------------------> |
| Col 1 (120px) | Col 2 | Col 3 |
| width : 120 | width : 3 | width : 2 |
| strictWidth : | strictWidth : | strictWidth : |
| true | false | false |

```

Columns 2 and 3 are in the ratio 3 : 2 so column 2 is 150% times the width of column 3.

---

<div class="post-metadata">

**Author:** ![vtran](https://avatars.discourse-cdn.com/v4/letter/v/779978/32.png) [@vtran](https://forum.inductiveautomation.com/u/vtran)\
**Post date:** [May 27, 2025, 11:37pm UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/12 "2025-05-27T23:37:24Z")

</div>

Probably can bind the `columns` property to the `data` property and just set the 1st column to `strictWidth` and the `width` value.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/8/0820557e79bef86db6bafa7c96a38f73e0b1f7ea.png)

```python
def transform(self, value, quality, timestamp):
	try:
		columns = value.getColumnNames() # get column names if dataset
	except:
		columns	= value[0].keys() # get column names if json array
		
	return [{
		'strictWidth': True,
		'width': 120,
		'field': columns[0] # grab first column name or can specify which ever one by exact name
	}] + [{}] * (len(columns)-1) # fill in the rest with blank objects for the remaining columns

```

EDIT: the `column` property would get reevaluated every time your `data` changes though. good if your column count changes during run time, if not, you can just bind to a static expression like so and I think it should only execute once when your view opens

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/b/ebeb45ab270d5dc14ff6d58f3bf0ebc51fdf5378.png)

```python
def transform(self, value, quality, timestamp):
	try:
		columns = self.props.data.getColumnNames() # get column names if dataset
	except:
		columns	= self.props.data[0].keys() # get column names if json array
		
	return [{
		'strictWidth': True,
		'width': 120,
		'field': columns[0] # grab first column name or can specify which ever one by exact name
	}] + [{}] * (len(columns)-1) # fill in the rest with blank objects for the remaining columns

```

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 28, 2025, 8:02am UTC](https://forum.inductiveautomation.com/t/1st-column-width-via-script/106731/13 "2025-05-28T08:02:32Z")

</div>

Thank you all for your answers.

Finally I opt for:

binding this.props.data property to the columns.

Aplied a script transfrom to it:

```python
def transform(self, value, quality, timestamp):
	try:
		columns = self.props.data.getColumnNames()
	except:
		columns = list(self.props.data[0].keys())
	
	return [
		{
			'field': col,
			'width': 182,
			'strictWidth': True
		} if i == 0 else {}
		for i, col in enumerate(columns)
	]

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/b/3bc4d7f23ce078008f7c5332f76c5b61478924ea.png)

and now the first column has the necesary width to show the main table data.

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/3/132c2f08cae955dd0eae7b43870e8a06d9870e4e.png)

Cheers!
