RE: Checkbox

Hi Everyone,

I am trying to achieve multi selection checkbox but its not working as expected

 a!checkboxField(
              label: "",
              choiceLabels: cons!CR_TXT_CHOICE_LABELS_YES_NO[1],
              choiceValues: cons!CR_APP_INT_CHOICE_VALUES[1],
              value: if(
                contains(
                  cons!CR_APP_INT_CHOICE_VALUES[1],
                  tointeger(local!selectionFlag_int)
                ),
                tointeger(local!selectionFlag_int),
                null()
              ),
              saveInto: local!selectionFlag_int,
              align: "LEFT"
            ),
Currently, If I select one checkbox it is selecting all checkbox ,But I want to select multi checkbox ,How would I achieve this, can anyone correct this code .

Thanks in Advance.

  Discussion posts and replies are publicly visible

Parents Reply Children
  • Then you can just remove the choice label and pass list of empty text in choice labels. Note that number of empty text in choice label must match number of choice values

    a!localVariables(
      local!selectionFlag_int,
      a!checkboxField(
        label: "",
        choiceLabels: {"","",""},
        choiceValues: {1,2,3},
        value: local!selectionFlag_int,
        saveInto: local!selectionFlag_int,
        align: "LEFT"
      )
    )

  • According to above code ,If I select one checkbox it is selected for all the rows by default, This should not happen like this User has to select checkbox  

  • May i know why you attached a checkbox field code in the question?

    Are you using an editable grid?

    If it is a readonly grid, I suggest you to use the selection parameter which comes as part of the grid. Please pass selectable as true and use the following parameters.

    selectable: true,
    selectionValue: local!selection,
    selectionSaveInto: 

  • yeah It is ReadOnly grid But I need to provide one option to user to select multiple rows and on select of multiple rows need to enable multidrop down.

  • Please refer "Grid with selection" pattern in the interface designer or refer the code below

    {
      a!localVariables(
        /* This variable is used to persist the checkbox on selected items by holding the identifiers of the selected rows. */
        local!selection,
        /* This variable would be used to pass the full rows of data on the selected items out of this interface, such as to a process model. */
        local!selectedEmployees,
        {
          a!columnsLayout(
            columns:{
              a!columnLayout(
                contents:{
                  a!gridField(
                    label: "Employee Directory",
                    /* Replace the dummy data with a query, rule, or function that returns a datasubset and uses fv!pagingInfo as the paging configuration. */
                    data: todatasubset(
                      {
                        a!map(id: 11, name: "Elizabeth Ward",  dept: "Engineering",     role: "Senior Engineer",       team: "Front-End Components",     pto: 15, startDate: today()-500),
                        a!map(id: 22, name: "Michael Johnson", dept: "Finance",         role: "Payroll Manager",       team: "Accounts Payable",         pto: 2,  startDate: today()-100),
                        a!map(id: 33, name: "John Smith",      dept: "Engineering",     role: "Quality Engineer",      team: "User Acceptance Testing",  pto: 5,  startDate: today()-1000),
                        a!map(id: 44, name: "Diana Hellstrom", dept: "Engineering",     role: "UX Designer",           team: "User Experience",          pto: 49, startDate: today()-1200),
                        a!map(id: 55, name: "Francois Morin",  dept: "Sales",           role: "Account Executive",     team: "Commercial North America", pto: 15, startDate: today()-700),
                        a!map(id: 66, name: "Maya Kapoor",     dept: "Sales",           role: "Regional Director",     team: "Front-End Components",     pto: 15, startDate: today()-1400),
                        a!map(id: 77, name: "Anthony Wu",      dept: "Human Resources", role: "Benefits Coordinator",  team: "Accounts Payable",         pto: 2,  startDate: today()-300)
                      },
                      fv!pagingInfo
                    ),
                    columns: {
                      a!gridColumn(
                        label: "Name",
                        sortField: "name",
                        value: fv!row.name
                      ),
                      a!gridColumn(
                        label: "Department",
                        sortField: "dept",
                        value: fv!row.dept
                      ),
                      a!gridColumn(
                        label: "Start Date",
                        sortField: "startDate",
                        value: fv!row.startDate,
                        align: "END"
                      )
                    },
                    pageSize: 7,
                    selectable: true,
                    selectionValue: local!selection,
                    selectionSaveInto: {
                      local!selection,
                      /* This save adds the full rows of data for items selected in the most recent user interaction to local!selectedEmployees. */
                      a!save(local!selectedEmployees, append(local!selectedEmployees, fv!selectedRows)),
                      /* This save removes the full rows of data for items deselected in the most recent user interaction to local!selectedEmployees. */
                      a!save(local!selectedEmployees, difference(local!selectedEmployees, fv!deselectedRows))
                    }
                  )
                }
              )
            },
            stackWhen: {
              "PHONE",
              "TABLET_PORTRAIT"
            }
          )
        }
      )
    }

  • 0
    Certified Senior Developer
    in reply to JS0001

    You will have to configure your variable as an array value and when you save the values you need to append to the variable.