modal form checkbox field

The checkbox field (type: "checkbox") displays a check box in the modal form() dialog that lets you toggle the state.

Checkbox Field Properties

  • type ("checkbox") - specifies the form field type
  • name (string) - the field name that will be displayed above the text box
  • id (string) - the path that specifies the source/target property of the data object
  • disabled (boolean) - makes the field disabled (inaccessible and read-only); optional
  • children (array) - a list of child form fields that will be accessible when the checkbox is checked; optional
  • cssClass (string) - additional CSS class that will be applied to the form field; optional
  • onValidate (function) - a callback function used to validate the field value; optional

Examples

Single checkbox field

import {Modal} from "@daypilot/modal";

// ...

async function textField() {

  const form = [
    {name: "I agree", id: "agree", type: "checkbox"},
  ];

  const data = {
    agree: false
  };

  const modal = await Modal.form(form, data);
  console.log(modal);

}

List of checkboxes:

import {Modal} from "@daypilot/modal";

// ...

async function modalCheckboxes() {
  const form = [
    { name: "Task 1", id: "task1", type: "checkbox" },
    { name: "Task 2", id: "task2", type: "checkbox" },
    { name: "Task 3", id: "task3", type: "checkbox" },
    { name: "Task 4", id: "task4", type: "checkbox" },
  ];
  const data = {
    task3: true,
  };

  const modal = await Modal.form(form, data);
  console.log(modal);
}