For AI agents: the complete documentation index is available at https://docs.dataplatform.ovh.net/llms.txt, the full documentation bundle is available at https://docs.dataplatform.ovh.net/llms-full.txt, and this page is available as Markdown at https://docs.dataplatform.ovh.net/sdk/app-dynamic_parameters-list-checkbox.md.
  • 🇬🇧 English
  • Checkbox

    Warning

    Rework pending, no delivery date. The Front App SDK (ReactJS) and the Front API SDK (NodeJS) are both being replaced. This page documents the current release, remains accurate, and is maintained until the replacement ships. Code written against it keeps working.

    Checkboxes allow you to choose one or more items from a defined list.

    {
      "id": "year",
      "type": "filter",
      "component": "checkbox",
      "reference": "year",
      "default": ["2020"]
      "dictionary": "year",
      "items": [
        {
          "value": "2020",
          "label": "Year 2020"
        },
        {
          "value": "2019",
          "label": "Year 2019"
        },
        {
          "value": "2018",
          "label": "Year 2018"
        }
      ]
    }
    fieldsdescription
    referenceSpecifies the name of the field to modify in the queries in the case of a transform of type filter
    defaultWhen you first display, it will take this value.
    dictionaryLoad items automatically and dynamically from your DataPlant
    itemsManually define the elements to display, label will be displayed, value will be sent in the associated queries.
    Warning

    Checkboxes choices comes either from a list of items or from a dictionary.

    Code example

    Example:

    import React from 'react'
    import FpDynamicParameter from 'forepaas/dynamic-parameter'
    import moment from 'moment'
    
    const myDynP =  {
      id: 'city',
      type: 'filter',
      component: 'checkbox',
      reference: 'city',
      dictionary: 'city'
    }
    class MyComponent extends React.Component {
      render () {
        return (
          <div className='hello-world'>
            <FpDynamicParameter dynamic-parameter={myDynP} />
          </div>
        )
      }
    }
    export default MyComponent