Skip to Main Content

Introduction

This page presents three example interactive grids implementing IG Checkbox Plus to visualize the possible states of the column (Checked, Not Checked and NULL). Beside each grid there is region detailing the configuration used to achieve the results. All examples use same table and saving one interactive grid will refresh the others.

Read Only Support

The read only column setting is supported by disabling the ability of the user to change the value when they click on the checkbox (or icon). You can test this functionality on this page. Use the button on the right-side column to enable or disable the read only setting for the column.

Checked Value

The value representing the checked state must be set using the plug-in attribute Value When Checked. When a column contains this value, the plug-in renders a checked checkbox or the icon representing the checked state. An icon can be selected using the plug-in attribute Icon Checked.

Not Checked Value

The value representing the not checked state must be set using the plug-in attribute Value When Not Checked. When a column contains this value, the plug-in renders an unchecked checkbox or the icon representing the not checked state. An icon can be selected using the plug-in attribute Icon Not Checked.

NULL Value

When the column value is NULL, the interactive grid will not render a checkbox or an icon. However, activated columns containing a NULL value allows the end user to set a checked or not checked value. You can test this behavior by unchecking a checkbox in Example 1 and saving the interactive grid.

When NULL is used as the default value for new rows, then a new row's checkbox/icon is semi-transparent. After changing the state of a new row checkbox/icon there is no way to make it null again without an additional dynamic action that sets the value to null.

Still, after focusing on the column (in the interactive grid edit mode) containing the null value it is possible to change the value according to the plug-in configuration.

Example 1

This example shows a checkbox input representing the state of a column. Clicking on the checkboxes without activating IG edit mode has no effect. To change the value of the cell you, have to activate edit mode or double click on the cell.

This configuration allows only two values to be set. Y as a checked value and NULL as a not checked value. New rows are added with a default value of NULL.

Example 2

This example shows APEX icons representing the state of a column. Independent of the interactive grid edit mode, the user is able to change the state of the column.

This configuration allows only two values to be set. Y as a checked value and N as a not checked value. New rows are added with a default value of N.

Example 3

This example shows APEX icons representing the state of a column. Independent of the interactive grid edit mode, the user is able to change the state of the column. Additionaly, when the user hovers over the icon, a title is displayed.

This configuration allows all three values to be set. Y as the checked value, N as the not checked value and NULL for new rows.

Example 1

IG | Example 1

Settings

Example 2

IG | Example 2

Settings

Example 3

IG | Example 3

Settings