Introduction

In this article, we will demonstrate how to apply coloring to the values inside a List. You can color the value itself or the area around the value using JavaScript.

Figure 1: Sample List

Sample Form

Figure 1: Sample Form


JavaScript Conditional Formatter Configuration

In the sample, we will be applying the Formatter to the following Field:

  • Age
  • Gender
  • Country


Figure 3: Age Field Configuration


Figure 4: Gender Field Configuration


Figure 5: Country Field Configuration


Here is what the script looks like when properly formatted:

JavaScript
"<div style='color:white;background-color:red;text-align:center;border-radius:3px;font-weight:600;padding:5px;'>" +
    {country} + 
"</div>"


Sample App

APP_kb_dx8_conditionalFormattingSample.jwa

  • No labels