# Power Table custom renderer with JButton

**URL:** <https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970>\
**Category:** Ignition\
**Created:** [July 26, 2016, 1:32am UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970 "2016-07-26T01:32:45Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![dfreiberger](https://avatars.discourse-cdn.com/v4/letter/d/ee7513/32.png) [@dfreiberger](https://forum.inductiveautomation.com/u/dfreiberger)\
**Post date:** [July 26, 2016, 1:32am UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/1 "2016-07-26T01:32:45Z")

</div>

Hello,

I am trying to add a button to a column in a power table. I am able to add the button and register an action listener, but the clicking event is never received by the listener. Any suggestions?

In the Power Table “configureCell” extension method I have:

[code] if colName == “Action”:  
import java  
from javax.swing import JButton  
from javax.swing.table import TableCellRenderer

```
	class MyTableCellRenderer(TableCellRenderer):
		def __init__ (self):
			super(MyTableCellRenderer, self). __init__ ()
			self.button = JButton("test")
			
		def getTableCellRendererComponent(self, table, value, isSelected, hasFocus, row, column):
			return self.button
	        
	r = MyTableCellRenderer()
	return { "renderer": r.button }[/code]

```

In the Power Table “configureEditor” extension method I have:

[code] if colName == “Action”:  
import java  
from java.awt.event import ActionListener  
from javax.swing import JButton  
from javax.swing.table import TableCellEditor

```
	class MyTableCellEditor(TableCellEditor):
		def __init__ (self):
			super(MyTableCellEditor, self). __init__ ()
			self.button = JButton("test")
			
			class ActionListener1(ActionListener):
				def actionPerformed(self, event):
					print "clicked!"
			
			al1 = ActionListener1()
			self.button.addActionListener(al1)
			
		def getCellEditorValue():
			return None
		
		def getTableCellEditorComponent(self, table, value, isSelected, row, column):
			return self.button
	        
	e = MyTableCellEditor()
	return { "editor": e }[/code]
```

---

<div class="post-metadata">

**Author:** ![dfreiberger](https://avatars.discourse-cdn.com/v4/letter/d/ee7513/32.png) [@dfreiberger](https://forum.inductiveautomation.com/u/dfreiberger)\
**Post date:** [July 27, 2016, 4:04pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/2 "2016-07-27T16:04:25Z")

</div>

Any suggestions?

The goal is to add several buttons to every row in the power table to enable actions such as “open link”, “delete row”, etc.

I am using separate columns with an icon to achieve this result currently, but it is not ideal.

---

<div class="post-metadata">

**Author:** ![jpark](https://avatars.discourse-cdn.com/v4/letter/j/a88e57/32.png) [@jpark](https://forum.inductiveautomation.com/u/jpark)\
**Post date:** [July 27, 2016, 7:07pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/3 "2016-07-27T19:07:18Z")

</div>

Can you use the onMousePressed extension function? You’ll have the rowIndex and colIndex/colName variables available.

---

<div class="post-metadata">

**Author:** ![dfreiberger](https://avatars.discourse-cdn.com/v4/letter/d/ee7513/32.png) [@dfreiberger](https://forum.inductiveautomation.com/u/dfreiberger)\
**Post date:** [August 1, 2016, 10:58pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/4 "2016-08-01T22:58:15Z")

</div>

> [@](#):
>
> Can you use the onMousePressed extension function? You'll have the rowIndex and colIndex/colName variables available.

Unfortunately this does not provide enough information to determine what button was pressed within a single cell. I am using the double click extension method at this point to pick up on a click event anywhere within the cell, but this means that I can only have one button (or image) per cell.

I think I will be able to solve this another way however, perhaps by using a template repeater.

---

<div class="post-metadata">

**Author:** ![Phong\_Pham](https://avatars.discourse-cdn.com/v4/letter/p/9f8e36/32.png) [@Phong\_Pham](https://forum.inductiveautomation.com/u/Phong_Pham)\
**Post date:** [August 24, 2016, 11:43pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/5 "2016-08-24T23:43:59Z")

</div>

I have the same request as in this thread. I found a similar thing in the Ignition Demo- OEE Downtime table. (see attached screenshot)  
I tried to trace the code in the given project but did not find anything.  
Any ideas how to implement this?

---

<div class="post-metadata">

**Author:** ![nmudge](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nmudge/32/3394_2.png) [@nmudge](https://forum.inductiveautomation.com/u/nmudge)\
**Post date:** [August 25, 2016, 8:43pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/6 "2016-08-25T20:43:09Z")

</div>

Hi Guys,

I have the exact solution for you.

It is not enough to implement the TableCellEditor interface. You must also extend/subclass the AbstractCellEditor class at the same time.

The reason is because AbstractCellEditor implements the CellEditor interface which needs to be implemented in order for general editors/components, such as the JButton, to work.

Here is a simple configureEditor example that works!:`if colName == "String Column":
	from javax.swing import AbstractCellEditor, JButton
	from javax.swing.table import TableCellEditor
	def func(e):
		print "This works. My Test."			
	class MyCellEditor(AbstractCellEditor,TableCellEditor):
		def getTableCellEditorComponent(self,table,value,isSelected,row,column):
			return JButton("My Button",actionPerformed=func)
	return {'editor':MyCellEditor()}`Also make sure that your column is set as Editable in the Table Customizer.

Best,

---

<div class="post-metadata">

**Author:** ![Live\_Ed](https://avatars.discourse-cdn.com/v4/letter/l/91b2a8/32.png) [@Live\_Ed](https://forum.inductiveautomation.com/u/Live_Ed)\
**Post date:** [December 8, 2016, 4:52pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/7 "2016-12-08T16:52:04Z")

</div>

That worked great, but how do I pass in the selected row or any other properties from the user?

---

<div class="post-metadata">

**Author:** ![Live\_Ed](https://avatars.discourse-cdn.com/v4/letter/l/91b2a8/32.png) [@Live\_Ed](https://forum.inductiveautomation.com/u/Live_Ed)\
**Post date:** [December 8, 2016, 5:29pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/8 "2016-12-08T17:29:57Z")

</div>

Nevermind - I forgot about the self attributes. I can use the self.selectedRow for example.

---

<div class="post-metadata">

**Author:** ![nmudge](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nmudge/32/3394_2.png) [@nmudge](https://forum.inductiveautomation.com/u/nmudge)\
**Post date:** [December 8, 2016, 7:19pm UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/9 "2016-12-08T19:19:30Z")

</div>

Yes, correct.

---

<div class="post-metadata">

**Author:** ![pkhatale22](https://avatars.discourse-cdn.com/v4/letter/p/e0b2c6/32.png) [@pkhatale22](https://forum.inductiveautomation.com/u/pkhatale22)\
**Post date:** [August 29, 2019, 9:32am UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/10 "2019-08-29T09:32:48Z")

</div>

Can I used a Toggle Button Component instead of Button Component???

---

<div class="post-metadata">

**Author:** ![giulio.comito](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/giulio.comito/32/12671_2.png) [@giulio.comito](https://forum.inductiveautomation.com/u/giulio.comito)\
**Post date:** [December 19, 2019, 9:25am UTC](https://forum.inductiveautomation.com/t/power-table-custom-renderer-with-jbutton/11970/11 "2019-12-19T09:25:19Z")

</div>

Nice, it works! Thank you so much!