Conditionally Grey out ChoiceLabels for Checkbox field

Hi,

Could anyone suggest how can we conditionally grey out only some of the choiceLabels for checkbox field while displaying all the choicelabels to the user.

 

thanks in advance

  Discussion posts and replies are publicly visible

Parents
  • Hi ,

    While I think has the best solution to use an editable grid, I took this as a bit of a challenge because I think it may be a use case I would have at some point.

    Below is some example code I put together to show this functionality. Putting this into a live application will take some additional work, but shows the idea you are attempting to implement.

    load(
    local!options: {
    "A",
    "B",
    "C",
    "D"
    },
    local!disabledOptions: {
    "A",
    "C"
    },
    local!values,
    {
    a!richTextDisplayField(
    label: "Disabled Check Boxes Example"
    ),
    a!forEach(
    items: local!options,
    expression: a!checkboxField(
    labelPosition: "COLLAPSED",
    choiceLabels: fv!item & if(
    length(
    wherecontains(
    fv!item,
    local!disabledOptions
    )
    ) = 0,
    {},
    " - Disabled"
    ),
    choiceValues: fv!item,
    disabled: wherecontains(
    fv!item,
    local!disabledOptions
    ),
    value: index(
    local!values,
    wherecontains(
    fv!item,
    local!values
    ),
    null
    ),
    saveInto: a!save(
    target: local!values,
    value: if(
    isnull(
    save!value
    ),
    remove(
    local!values,
    wherecontains(
    fv!item,
    local!values
    )
    ),
    append(
    local!values,
    save!value
    )
    )
    )
    )
    ),
    a!paragraphField(
    label: "Saved Values",
    value: local!values
    )
    }
    )
  • 0
    Certified Lead Developer
    in reply to bradc

    That could be a good approach too, though there may be some unintended consequences in the future of using multiple fields (i dunno, tab-ability maybe), but it looks pretty good.

    As a side note, when pasting a big chunk of code like that, I strongly recommend you go into Rich Text mode and insert a Code block, which allows retention of spacing as well as a scrollable box so you don't blow everyone out of the water with a pages-long code snippet, like this:

    load(
      local!options: {
        "A",
        "B",
        "C",
        "D"
      },
      local!disabledOptions: {
        "A",
        "C"
      },
      local!values,
      {
        a!richTextDisplayField(
          label: "Disabled Check Boxes Example"
        ),
        a!forEach(
          items: local!options,
          expression: a!checkboxField(
            labelPosition: "COLLAPSED",
            choiceLabels: fv!item & if(
              length(
                wherecontains(
                  fv!item,
                  local!disabledOptions
                )
              ) = 0,
              {},
              " - Disabled"
            ),
            choiceValues: fv!item,
            disabled: wherecontains(
              fv!item,
              local!disabledOptions
            ),
            value: index(
              local!values,
              wherecontains(
                fv!item,
                local!values
              ),
              null
            ),
            saveInto: a!save(
              target: local!values,
              value: if(
                isnull(
                  save!value
                ),
                remove(
                  local!values,
                  wherecontains(
                    fv!item,
                    local!values
                  )
                ),
                append(
                  local!values,
                  save!value
                )
              )
            )
          )
        ),
        a!paragraphField(
          label: "Saved Values",
          value: local!values
        )
      }
    )

Reply
  • 0
    Certified Lead Developer
    in reply to bradc

    That could be a good approach too, though there may be some unintended consequences in the future of using multiple fields (i dunno, tab-ability maybe), but it looks pretty good.

    As a side note, when pasting a big chunk of code like that, I strongly recommend you go into Rich Text mode and insert a Code block, which allows retention of spacing as well as a scrollable box so you don't blow everyone out of the water with a pages-long code snippet, like this:

    load(
      local!options: {
        "A",
        "B",
        "C",
        "D"
      },
      local!disabledOptions: {
        "A",
        "C"
      },
      local!values,
      {
        a!richTextDisplayField(
          label: "Disabled Check Boxes Example"
        ),
        a!forEach(
          items: local!options,
          expression: a!checkboxField(
            labelPosition: "COLLAPSED",
            choiceLabels: fv!item & if(
              length(
                wherecontains(
                  fv!item,
                  local!disabledOptions
                )
              ) = 0,
              {},
              " - Disabled"
            ),
            choiceValues: fv!item,
            disabled: wherecontains(
              fv!item,
              local!disabledOptions
            ),
            value: index(
              local!values,
              wherecontains(
                fv!item,
                local!values
              ),
              null
            ),
            saveInto: a!save(
              target: local!values,
              value: if(
                isnull(
                  save!value
                ),
                remove(
                  local!values,
                  wherecontains(
                    fv!item,
                    local!values
                  )
                ),
                append(
                  local!values,
                  save!value
                )
              )
            )
          )
        ),
        a!paragraphField(
          label: "Saved Values",
          value: local!values
        )
      }
    )

Children