Checkbox Field with Children (Form)

modal form checkbox with children

The checkbox form field supports child fields.

  • Child fields appear indented beneath the checkbox field.
  • When the checkbox is unchecked, the child fields become disabled.
  • You can use this feature to display secondary options that are dependent on the primary option's activation.

Example

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

// ...

async function modalCheckbox() {
  const form = [
    { name: "Name", id: "props.firstName" },
    {
      name: "Specify last name",
      id: "enabled",
      type: "checkbox",
      children: [{ name: "Last name", id: "props.lastName" }],
    },
  ];
  const data = {
    enabled: true,
    props: {
      firstName: "John",
      lastName: "Doe",
      another: "field",
    },
  };

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