Cell color propagates to empty rows if only one row has data

Appsmith Community v1.8.4, self hosted.

I have a table cell whose background color is calculated from its value in a JS function. Works well in all cases except when there is only one row with data in that table. In that case every row’s cell gets that color:

2 rows, all ok:

1 Like

:wave: @arminus! Welcome back to the Appsmith Community.

Can you share the JS snippet you’ve written to add the background color?

Here you go:

(I also tried with doing a default: return “#FFFFFF”; - no change)

And the column definition looks like this:

Unfortunately, I am not able to reproduce the issue -

Screenshot 2022-10-14 at 12.53.43 PM

Can you please invite support@appsmith.com as developer to your app? I’d like to take a closer look.

That’ll take a while. The app is on an intranet with data I cannot share. I’ll try to replicate/rehost later today.

1 Like

I just invited support@appsmith.com

Any news here? Are you able to reproduce this?

Hey! I am really sorry for the delay. Let me get back to you in some time with an update. I totally missed this :pensive:

@arminus turns out we didn’t receive any email (not sure if it’s setup). Can you DM me the link to the app directly?

@arminus It looks like the table your are using is old version of the Table widget which had a bug. Can you please delete it and create a new table? I’ve created a Debug page in your app to showcase it

Thanks a lot!

Is there a way to do this kind of painlessly? Without having to recreate all the table’s column definitions etc.? And whatever else I might be loosing when deleting the table?

Right now, there is no simple way. (As, this is a very rare scenario). Although, I’ll raise a feature request on your behalf for this.

And hacking the exported JSON? And then re-importing it?

I’m just hesitant to do that delete and by doing so create some hidden regressions…

I’d rather argue the other way around. The exported app file is prone to manual errors during editing. Also, you’ll not have a full picture of how the new table obj is suppose to look like. etc.

Ok, I’ll have to bite that bullet then. Thanks again for the help!

Thanks for your patience and continued support :slight_smile:

We are rooting for you :rocket:

There’s one more thing - unrelated to the original problem here: While re-testing, I realized there is another issue: The lower right compartment is a iframe which is filled based on the current selection in the master table. This works for a row click (due to master table’s onRowSelected) but that function does not get triggered on page load - although the first row is actually selected.

This might be related to what I brought up back here or maybe not. Question is, how can I trigger a JS function after the upper table is loaded and the default selection is set? I tried adding it to JScrudComment.get like so

export default {
	get: () => {
		if (Orders.selectedRow.status !== undefined) {
			storeValue("orderModified", false);
			storeValue("status", Orders.selectedRow.status)
			SQLgetComments.run(() => { JSFormatComments.getCards()}, () => {})

but this doesn’t make a difference

If you know the default selected row you could access it directly and override it once a new value is selected.

It’s not so much about knowing what the default selected row is (it’s 0 by default) but the problem, that although after page load, row 0 is visually selected, Orders.selectedRow is undef until I actually click a row. This is kind of strange.

And since the code and queries of the secondary displays (iframe and table) depend on Orders.selectedRow, they silently fail after page load (-> until I actually click a row in the master/Orders table).

In this case I recommend changing the references to the selected row with a reference to an appsmith store value.

  1. On page load you can set the value to 0
  2. on row selected you can update the value,
  3. in your table and iframe you can reference Orders.tableData[appsmith.store.selectedRowIndex] (assuming you store the value to the key selectedRowIndex. This key can be any name you like.).

This should also update it any time the stored value is updated. Could you try this? Or are there too many references for this to be plausible?