CPHPython
CPHPython

Reputation: 13699

How to use a when in a list item (referencing the proper path)?

I am trying to use the Inspector's when parameter in a list item. In this particular case, I want to hide the body text field of an item when the user uses a toggle button:

inputs: {
  mylist: {
    type: 'list',
    label: 'List of items',
    item: {
      type: 'object',
      properties: {
        attrs: {
          text: {
            title: {
              type: 'text',
              label: 'Title',
              index: 1
            },
            body: {
              type: 'textarea',
              label: 'Body',
              index: 2,
              when: { eq: {'????': false} } // what path should be used here?
            }
          },
          toggles: {
            toggleBody: {
              defaultValue: false,
              type: 'text',
              label: 'Hide body',
              index: 3
            },
          }
        } // attrs
      } // properties
    } // item
  }
}

I have verified through renderFieldContent:

renderFieldContent: function(options, path, value) {
  if(path.endsWith('/attrs/text/body')){
    console.log(path);
  }
} // 1 item in the list outputs: mylist/0/attrs/toggles/toggleBody

That the list items paths follow the pattern `mylist/${i}/attrs/toggles/toggleBody` where ${i} is the item number...

I tried to reference mylist/0/attrs/toggles/toggleBody in the expression (so it would always reference the first item), but this also does not seem to work... Is there a way to reference a list item property's path?

Upvotes: 1

Views: 230

Answers (1)

Roman
Roman

Reputation: 1674

From Rappid v3.2, one can place wildcards within the path.

'mylist/${index}/attrs/toggles/toggleBody'

A wildcard ${index} will be dynamically substituted for the actual index of the item inside which the when clause is being evaluated.

inputs: {
    mylist: {
        type: 'list',
        label: 'List of items',
        item: {
            type: 'object',
            properties: {
                attrs: {
                    text: {
                        title: {
                            type: 'text',
                            label: 'Title',
                            index: 1
                        },
                        body: {
                            type: 'textarea',
                            label: 'Body',
                            index: 2,
                            when: {
                                eq: {
                                    'mylist/${index}/attrs/toggles/toggleBody': false
                                },
                                // otherwise: { unset: true }
                                // Uncomment above to clear the body text
                                // from the model when the body is hidden
                            }
                        }
                    },
                    toggles: {
                        toggleBody: {
                            defaultValue: false,
                            // Changed to built-in toggle
                            type: 'toggle',
                            label: 'Hide body',
                            index: 3
                        }
                    }
                }
            }
        }
    }
}

Upvotes: 1

Related Questions