Viewi

Viewi UI

Checkbox

A checkbox UI component is a graphical element in a user interface that allows users to make a binary choice, typically between selecting or deselecting an option.

Usage

Sure, do not worry, we will keep you safe! 
<CheckBox label="Remember Me" model="$rememberMe" />
<div if="$rememberMe">
    You will be remembered!
</div>
<div else>
    Sure, do not worry, we will keep you safe!
</div>
<?php

class FormsExample extends BaseComponent
{
    public bool $rememberMe = false;
}

Properties

model - two-way data binding. The bound value is a boolean: true when checked.

label - (optional), label text for the input.

hint - (optional), hint text for the input.

id - (optional), id attribute of the input. The label is linked to the input by this id.

name - (optional), the name used to match validation errors when the checkbox is inside an ActionForm (used when id is not set). It is not rendered as an HTML attribute.

isInvalid - (optional), boolean, marks the input as invalid. Inside an ActionForm it is set by validation, and the validation messages are shown under the checkbox. Checking or unchecking the box resets it.

Events

(change) - event that happens when the value gets changed. The event value is the new checked state (true or false).

Slots

default - (optional), default slot, renders after the hint container.