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
        )
      }
    )

  • 0
    Certified Lead Developer
    in reply to Mike Schmitt

    Additionally, here's a code snippet for my Editable Grid based solution:

    load(
      local!selectedValues: {},
      
      local!allOptions: {
        "Option 1",
        "Option 2",
        "Option 3 (disabled)",
        "Option 4",
        "Option 5 (disabled)"
      },
      
      a!gridLayout(
        label: "Select Options",
        selectable: true(),
        
        selectionSaveInto: local!selectedValues,
        selectionValue: local!selectedValues,
        
        shadeAlternateRows: false(),
        spacing: "DENSE",
        borderStyle: "LIGHT",
        
        headerCells: {
          a!gridLayoutHeaderCell(
            label: ""
          )
        },
        
        rows: a!forEach(
          local!allOptions,
          a!gridRowLayout(
            id: fv!item,
            selectionDisabled: find("disabled", fv!item) <> 0,
            contents: {
              a!textField(
                value: fv!item,
                readOnly: true()
              )
            }
          )
        )
      )
    )

  • 0
    Certified Senior Developer
    in reply to Mike Schmitt

    Hi ,

    I have the same requirement , but every time user will be selecting single choice .

    Basically I need kind of radio field in my case.

    Based on some status of my record , i need to enable few actions and disable few action and user will perform any one enabled action.

    Any suggestion.

  • 0
    Certified Lead Developer
    in reply to soujanya B

    If you can't use a radio button field with validations on disabled options, then the next best solution is probably still to use the editable grid with selections, and simply make the saveIntos work such that selecting one row deselects any previously-selected row.

Reply Children
No Data