CheckboxImageGroup Lightning Web Component ReadMe (Managed Package)

For the managed package runtime, this page contains a CheckboxImageGroup LWC ReadMe for each Vlocity release.

Managed Package app icon This information is for Omnistudio for Managed Packages. For Omnistudio on standard runtime, see Omnistudio Help.

Vlocity Insurance and Health Winter '20 and Vlocity CME Spring '20

The CheckboxImageGroup Lightning Web Component extends the CheckboxGroup Lightning Web Component adding additional features. The CheckboxImageGroup Lightning Web Component enables users to select from single or multiple options by clicking images instead of checkboxes.

Available c-checkbox-image-group Attributes

Attribute	Value	Type	Required	Description
checked	true, false (Default: false)	boolean		Sets the default value of checkbox input. Applies only when is-display-checkbox is true.
enabled-caption	true, false (Default: false)	boolean		To show a caption, set to true.
control-width	Width in pixels. (Default: auto)	string		Sets the width of checkbox image.
control-height	Height in pixels. (Default: auto)	string		Sets the height of checkbox image.
image-count-in-row		integer, string		To set the number of checkbox images to display in a row, set this attribute.
is-display-checkbox	true, false (Default: false)	boolean	yes (if is-image is set to false)	To display checkbox as a checkbox input, set to true. If set to true, is-image cannot be true.
is-image	true, false (Default: false)	boolean	(if is-display-checkbox is set to false)	To display checkbox as image, set to true. If set to true, is-display-checkbox cannot be true.
is-image-display	true, false (Default: false)	boolean		To display images, set to true.

Example c-checkbox-image-group Component

<c-checkbox-image-group
  class="slds-p-top_small"
  name="check"
  required
  image-count-in-row=6
  type="checkbox"
  label="Don't Accept"
  is-display-checkbox="true"
>
</c-checkbox-image-group>

Available Methods

checkValidity()

Returns the valid attribute value (boolean) on the ValidityState object.

reportValidity()

Displays the error messages and returns false if the input is invalid. If the input is valid, reportValidity() clears the error message and returns true.

setCustomValidity(message)

Sets a custom error message to display when the input value is submitted. Takes the message argument. If message is an empty string, the error message is reset.

showHelpMessageIfInvalid()

Displays error messages on invalid fields. An invalid field fails at least one constraint validation and returns false when checkValidity() is called.

focus()

Sets the focus on the textarea field.

Vlocity Insurance and Health Summer '19 and Vlocity CME Fall '19

The CheckboxImageGroup Lightning Web Component extends theCheckboxGroup Lightning Web Component adding additional features. TheCheckboxImageGroup Lightning Web Component enables users to select from single or multiple options by clicking images instead of checkboxes.