Introduction
Adding this plug-in to your kintone app allows you to change text color, background color, and text size depending on the values—or "conditions"—in the given field. This displays in both the record list and record detail views.
Record list view with conditional formatting
Record details view with conditional formatting
Installing the plug-in
Add the latest version of the conditional format plug-in to your app. Refer to kintone help for information about how to install a plug-in.
Adding a plug-in
Setting up the form
To set up the app form, use the following fields:
Format condition field
Choose which fields to evaluate. To evaluate strings and numbers, use "Text conditional format." To evaluate dates, use "Date conditional format." You can choose from the following field types:
- Text Format Conditions:
- String (single-line)
- Numeric value
- Calculation
- Radio button
- Drop down
- Record number
- String (multi-line)
- Checkbox
- Multi-choice
- Status (Process management) (*Reflects the record list window only)
- Date Format Conditions:
- Date
- Date and time
- Created on
- Updated on
Format target field
Choose the field that should have the formatting applied to it. It can be the same field you are evaluating or a different one. All the fields listed in the "Format condition field" can be selected.
Configuring the conditions
- From the app management window, open Settings > Plug-in and click the gear to access conditional format settings.
- Set up each field you want to apply formatting to.
Conditional formatting options
Note: Options in bold were are part of the 3/31/2017 update.
|
Option |
Mandatory? |
Description |
|
Field with condition |
Mandatory |
Choose the field to evaluate. This can be the same as the target field, or different. If the value in this field meets the conditions you set, the target field will change its formatting. |
|
Condition |
Mandatory |
The logical operator to use. You can choose if you want to change the format if the field is equal to, not equal to, etc. the value you set. If the value of the target field is a number, they are compared numerically. Text format conditions:
Date format conditions:
|
|
Value |
|
Enter the value to compare against the value of the field with the condition. Text format conditions:
Date format conditions:
|
|
Field to Format |
Mandatory |
Choose the target field that will receive the formatting. If the conditions that you set up are met, this field will change color, font, style, etc. |
|
Font color |
|
Enter the hex value of the color for the target field. |
|
Background color |
|
Enter the color code to set the target background color to. If you do not wish to change the background color, enter "#". |
|
Text size |
|
Choose the text size of the target field. The following text sizes are supported:
|
|
Text style |
|
Choose the text style of the target field. The following styles are supported:
|
|
"+" button |
|
Adds a new row below the selected row |
|
"-" button |
|
Deletes the selected row |
- Click Save.
Note: If required fields are missing when you click Save, the invalid configuration is deleted. - Click Finish Setting to see the new formatting applied to your app.
Using the plug-in
- Add or update a record.
- The format of the target field will be changed in the record list window and record details window depending on the conditions you set.
Downloading the plug-in
Packaged plug-in
Updates
v3.1.1: Released 2017/08/08
Restrictions
- Not compatible with IE8.
- Cannot be used on the smartphone.
- The color picker is only available in Firefox and Chrome. It may not work on other browsers.
- After editing a record, the conditional format will not display. Update the window to redisplay the format change.
- If multiple conditions apply, the lower line takes precedence. Date condition formatting takes precedence over string condition formatting.
- Conditional formatting is only supported for lists in table format. It may not work for lists in calendar format or customized format.
Notes
- Conditional formatting is not guaranteed.
- Support is not provided for this plug-in.
- This plug-in performs DOM manipulation to change field formatting. The implementation may be affected by updates. Please use caution when using this sample as a reference.