# How to edit cell my table?

**URL:** <https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121>\
**Category:** General Discussion\
**Tags:** perspective\
**Created:** [March 16, 2020, 2:09pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121 "2020-03-16T14:09:18Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 16, 2020, 2:09pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/1 "2020-03-16T14:09:18Z")

</div>

I have a table which displays the data from database, how can I edit the cell in the table, I don’t want to save the changes back to database, I am just trying to edit the cell value. In table property I have already enabled allowEditOn: single-click but still not allowing the edit the cell data.

Thank You

---

<div class="post-metadata">

**Author:** ![jonathan.taylor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jonathan.taylor/32/4048_2.png) [@jonathan.taylor](https://forum.inductiveautomation.com/u/jonathan.taylor)\
**Post date:** [March 17, 2020, 1:22pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/2 "2020-03-17T13:22:33Z")

</div>

Right click the table and choose table customizer.

Then select the Editable tick box for each column you wish to enable that for.

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

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 1:26pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/3 "2020-03-17T13:26:43Z")

</div>

There is no option called table customizer on right clicking the table in perspective

---

<div class="post-metadata">

**Author:** ![jonathan.taylor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jonathan.taylor/32/4048_2.png) [@jonathan.taylor](https://forum.inductiveautomation.com/u/jonathan.taylor)\
**Post date:** [March 17, 2020, 1:46pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/4 "2020-03-17T13:46:52Z")

</div>

Apologies, I was in Vision mode!

You need to make each item editable in the table. Example JSON below:

> {  
> "city": {  
> "value": "Folsom",  
> **"editable": true,**  
> "style": {  
> "backgroundColor": "#F7901D",  
> "classes": "some-class"  
> },  
> "align": "center",  
> "justify": "left"  
> },  
> "country": "United States",  
> "population": 77271  
> }

Once you have that, you will need to use the onCellEditCommit script to update that value into the dataset, but not into your original datasource.

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 1:58pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/5 "2020-03-17T13:58:03Z")

</div>

I cannot access each item since i am using database query to populate table data

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [March 17, 2020, 2:10pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/6 "2020-03-17T14:10:01Z")

</div>

If you are using a binding to populate the table, it will smash any edits you make locally every time it updates. You may have to bind to a custom property and decide (in a propertyChange event) when it is appropriate to overwrite the table data. When the script changes the cell locally, you will have to set a flag or set up some state that can be used to decide how to route the DB updates. There’s no magic wand that will resolve the conflicting sources of data for you.

---

<div class="post-metadata">

**Author:** ![jonathan.taylor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jonathan.taylor/32/4048_2.png) [@jonathan.taylor](https://forum.inductiveautomation.com/u/jonathan.taylor)\
**Post date:** [March 17, 2020, 2:16pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/7 "2020-03-17T14:16:10Z")

</div>

Adding a script transform to the data binding can add the editable item for you.

The below should make all cells editable, provided your return format is json:

```auto
	final = []
	for i in value:
		internal = {}
		for r in i:
			internal.update( {r:{"value":i.get(r,0),"editable":True}})
		final.append(internal)
	return final

```

Heed the advice above. When the binding updates, this won’t save your edits

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 2:52pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/8 "2020-03-17T14:52:22Z")

</div>

I think I am not explained it clearly, so what i am trying to do is I have a table called expense in database which have a boolean column called “selected”, so when i am retrieving that table in perspective table it shows a check box for that boolean column which is “selected”. I want to check that check box in run time so that i can select some rows in the table and perform some action on that rows, i don’t want to save that back to database i just want see which check boxs are selected in run time. But perspective table is not allowing to check the check box on run time.

---

<div class="post-metadata">

**Author:** ![Sunny](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sunny/32/13319_2.png) [@Sunny](https://forum.inductiveautomation.com/u/Sunny)\
**Post date:** [March 17, 2020, 2:59pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/9 "2020-03-17T14:59:38Z")

</div>

Add a event onEditCellCommit -\> script which looks something like this:

```auto
	col = event.column
	row = event.row
	
	self.props.data[row][col] = event.value

```

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 3:14pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/10 "2020-03-17T15:14:23Z")

</div>

added, still not allowing to check the check box

---

<div class="post-metadata">

**Author:** ![Sunny](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sunny/32/13319_2.png) [@Sunny](https://forum.inductiveautomation.com/u/Sunny)\
**Post date:** [March 17, 2020, 3:36pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/11 "2020-03-17T15:36:02Z")

</div>

If the issue is the fact that the checkbox is gray/disabled ![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/d/d8d410e65463ce5da9eaa93349e1b8361cfb7c09.png) vs ![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/8/8ab0320e47924e638c578a324d4f21f2c7fa8ec3.png) then you need to set your props.columns. See example below:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/d/d7766b9a14c5f9f691f9bd69798d44e651a09b9f.png)

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 4:44pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/12 "2020-03-17T16:44:19Z")

</div>

I don’t have columns since data is fetched from database, I have allowEditOn which enabled still its not allowing to edit. and check box is not grayed out or disabled. I can’t edit any cells including cells containing text  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/9/9914b261b03f7d73c6a7775392af1da30ffc9632.png)

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [March 17, 2020, 4:57pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/13 "2020-03-17T16:57:33Z")

</div>

You need to transform your data in the binding to have the editable column property true, similar to what Jonathan showed.

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 5:12pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/14 "2020-03-17T17:12:35Z")

</div>

No, I just want to select few rows of the table using check boxes and perform operation on that selected rows when a button is clicked.

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [March 17, 2020, 6:42pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/15 "2020-03-17T18:42:10Z")

</div>

~~Not “No”. You can’t get your desired editable checkboxes without transforming the incoming dataset.~~

Ok. Separate columns prop.

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 6:54pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/16 "2020-03-17T18:54:37Z")

</div>

Its working when set individual column prop, now i can check the check box but when i try to check multiple check boxes its not working. Only one row check box can be selected at a time.

---

<div class="post-metadata">

**Author:** ![Sunny](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sunny/32/13319_2.png) [@Sunny](https://forum.inductiveautomation.com/u/Sunny)\
**Post date:** [March 17, 2020, 6:59pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/17 "2020-03-17T18:59:48Z")

</div>

Not sure I’m following you, got a printscreen of your issue? Are you trying to multi select and multi change state with one (1) click?

---

<div class="post-metadata">

**Author:** ![ptchanchal](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@ptchanchal](https://forum.inductiveautomation.com/u/ptchanchal)\
**Post date:** [March 17, 2020, 7:05pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/18 "2020-03-17T19:05:46Z")

</div>

![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/0/05420fe145f809c22e3db8b023261ebe3f7bef4d.png)

Ya, the above figure is screen shot of my table, i am trying to select multiple row using check boxes and when i press the above button “approve all”, status column in the database should be updated for this selected rows

---

<div class="post-metadata">

**Author:** ![Sunny](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sunny/32/13319_2.png) [@Sunny](https://forum.inductiveautomation.com/u/Sunny)\
**Post date:** [March 17, 2020, 7:26pm UTC](https://forum.inductiveautomation.com/t/how-to-edit-cell-my-table/33121/19 "2020-03-17T19:26:19Z")

</div>

This is a bit more complex. You’ll need an unique ID (per row) on your table data that get transferred to the props.selection.data buffer (don’t forget to go with enableRowSelection: true), and change my previous event code for a loop cycling through that buffer and change the data to the source (props.data).
