Forum | Appery.io

How can I change ListItem background color based on value of Label in dynamically created ListItem? For example, I have a List on a page with one ListItem. In the ListItem I have a grid with 2 columns which contain a label and 1 row. Based on the text of the label I would like to change background color at runtime.

Hi Roger,

You can run custom JavaScript to check the values on "Value change" event.

I have tried adding JS to the Value Change event of the label and then I look at the label text and it is always "Label".

Actually, I misspoke. I added a click event for the ListITem and that always shows "Label". My Value Change event does not really do much. I added an alert to display the value but it never gets called.

What JS are you trying?

In the Value change event of the Label I have

alert (Tiggzi('IsDivider').text ());

For the ListItem containing the grid you can change the whole ListItem color using the following code on Value change event:
codeAppery('component_name1').css({'background-color': 'blue'});/code

The issue is the value change event does not appear to be firing. I have an alert in the JS now and it does not fire.

The List is dynamically populated from a REST Service. On each ListItem I have a grid with 2 columns that contain 1 label each. In my Value changed for one of the Labels I have an alert that is not appearing.

I just want to make sure I am using the Value Change of the Label, correct?

Roger,

What do you see in browser console? Are there any errors?

No errors. I moved my logic from the Value change to the JS on the data mapping request page for the label in question. I can now see the value by using the following. I just need to figure out how to get the parent object so I can manipulate the background color.

if (value == true) {

alert ('true');

// add code to get parent so we can change background color

}