Can't change cell color with Tabulator

[maki.fujita]

What I’m trying to do:
I want to use Tabulator to change the background color for each cell by value, but it doesn’t change when I specify the color code in ‘formatter’ key’s value.
Changing the row_background in Container Properties does not seem to change row color.

Code Sample:

class Test(TestTemplate):
	def __init__(self, **properties):
	# Set Form properties and Data Bindings.
	self.init_components(**properties)
	self.tabulator.data = Globals.global_value_dict['rows']
	self.tabulator.columns = [
		{'id': '0', 'title': '', 'field': '0', 'data_key': '0', 'headerSort': False, 'formatter': '#ff0'},
		{'id': '1', 'title': '', 'field': '1', 'data_key': '1', 'headerSort': False, 'formatter': '#f00'},
		{'id': '2', 'title': '1', 'field': '2', 'data_key': '2', 'headerSort': False, 'formatter': '#fff'},
	]
	def form_show(self, **event_args):
    	"""This method is called when the HTML panel is shown on the screen"""
    	if not self.visible:
      		self.update()
      		self.visible = True

[maki.fujita]

The above issue has been resolved.
However, a new problem is that when I try to replace the data in tabulator.data, I get an error as below.
TypeError: <lambda>() missing 1 required argument: 'formatterParams'

https://anvil.works/build#clone:RXNNDRJ722X7OYMU=GFGBMLIKIIZPXWYEKQ556YCM

How can I solve this problem?

[stucork]

That turned out to be a bug in Tabulator which should now be fixed

[maki.fujita]

Thank you for fixing it!
I have confirmed that the issue has been resolved.

One additional point I would like to know is how to output the value to a cell?

[CyCy]

When I open this Anvil App I get: AttributeError: The following column option(s) are invalid: 'id', 'data_key', 'cellFormatter'. You may need to include the required Module in Tabulator.modules.

• at app/tabulator/Tabulator/_custom_modules.py:314

Can you please help, Stu, as I too want to have Tabulator make a custom color background depending on the cell value and am struggling with the steps required to do this! thank you!

[stucork]

@CyCy this app was created with Tabulator v1.0.0
You can see the app working as expected if you pin the version to Tabulator v1.0.0 in the Dependency Settings.

The warnings are there in v2.x because, as they say, these column options are not valid and so ignored.

The main option you’re looking for is the cellFormatter I guess.
This is now just formatter in v2.x
You can read about formatters in the docs:

GitHub - anvilistas/tabulator: Anvil Wrapper for Tabulator

[CyCy]

thank you Stu - would you be so kind to just simply explain the steps I can take for the latest version of Tabulator to have a column where if the number in a cell > 5 then it is shaded yellow? I will gladly send good vibes your way for a simple solution I can implement using the current (amazing) version of Tabulator for Anvil! thank you sir!

[stucork]

def custom_formatter(cell, **params):
    value = cell.get_value()
    if value > 5:
        cell.get_element().style.backgroundColor = "yellow"
    return value

and then in your column definition

self.tabulator_1.columns = [
    ...
    {"title": "Foo", "field": "foo", "formatter": custom_formatter},
    ...
]

If that’s not enough, best to open a discussion topic here and share a clone link:

anvilistas/tabulator · Discussions · GitHub

—-

Post edited to add return value

[CyCy]

Much appreciated, Stu - thank you!