Checkbox as Radio button functionality

Certified Associate Developer

Hi everyone!

I'd like to explain my issue. I have a Record Type for Drivers, and one of its attributes is a boolean called "Primary driver." I've created an interface named "Driver" for entering information about a single driver, including a description, summary, and metrics. To allow users to mark a driver as the "Primary Driver," I've implemented a checkbox.

Additionally, I have a parent interface named "Multiple Drivers," where users can add up to 5 drivers or remove them. I've used a foreach loop to generate sections for each driver using the child interface. My main challenge is that I want users to be able to select only one driver as the "Primary driver." I'd like the checkboxes for each child interface in "Driver" to function as a group, similar to radio buttons. I want the selection to work smoothly, and users should not have to click again on an active checkbox to deactivate it.

I attempted to manage value changes, but they are saving as "true" and don't change to "false" when I select another checkbox. As you can see in the image, the values deactivate and change, but the "Primary" indicator for each driver object remains "true."

Checkbox

  Discussion posts and replies are publicly visible

Parents Reply Children
  • For instance I was able to whip up this quick example where 3 pre-defined, simplified, "driver" array members all have a "isPrimary" element and when any of them is set to true, the others are all set to false.

    a!localVariables(
      local!drivers: {
        a!map(id: 1, name: "Mike", isPrimary: false()),
        a!map(id: 2, name: "Stefan", isPrimary: true()),
        a!map(id: 3, name: "Yaha", isPrimary: false())
      },
      
      a!forEach(
        local!drivers,
        
        a!localVariables(
          local!currentDriverId: fv!item.id,
          a!boxLayout(
            label: "Driver " & local!currentDriverId,
            marginBelow: "STANDARD",
            contents: {
              a!textField(
                label: "Name",
                required: true(),
                value: fv!item.name,
                saveInto: fv!item.name
              ),
              a!checkboxField(
                choiceLabels: {"Primary"},
                choiceValues: {true()},
                value: if(fv!item.isPrimary, true(), null()),
                saveInto: {
                  a!save(
                    local!drivers.isPrimary,
                    a!forEach(
                      local!drivers,
                      if(
                        fv!item.id = local!currentDriverid,
                        if(save!value, true(), false()),
                        false()
                      )
                    )
                  )
                }
              )
            }
          )
        )
      )
    )

  • 0
    Certified Senior Developer
    in reply to Mike Schmitt

    Hi Mike, I tried to use this logic for value and saveInto parameters in my code, But still am not able to store the selected answers in local. Kindly guide me for this case where multiple answers can be selected for a question.

     

    a!localVariables(
      local!question: split(rule!MWJ_qe_multiCorrect_fetchQuestion(), ";"),
      local!option: split(rule!MWJ_qe_multipleCorect_options(), ";"),
      local!numberOfAnswers: 4,
      local!correctAnswer: rule!MWJ_qe_MultiCorrect_CorrectAnswer(),
      local!selectedAnswer: rule!MWJ_QE_MultiCorrectOption_SelectedAnswer(),
      local!Temp: stripwith(
        local!selectedAnswer.SelectedAnswer,
        "ZYWX[]:"
      ),
      /*local!result: intersection(local!correctAnswer, local!Temp),*/
      /*local!score: length(local!result),*/
    
      local!submit: false,
      {
        a!sectionLayout(
          label: "Exam",
          contents: {
            a!forEach(
              items: local!question,
              expression: a!localVariables(
                local!currentQuestion: fv!index,
                {
                  a!columnsLayout(
                    columns: {
                      a!columnLayout(
                        contents: {a!checkboxField(
                          choiceLabels: {
                            a!forEach(
                              items: enumerate(local!numberOfAnswers),
                              expression: index(
                                split(stripwith(local!option, "[]ZYWX:"), ","),
                                if(
                                  local!currentQuestion = 0,
                                  fv!index,
                                  fv!index + local!numberOfAnswers * (local!currentQuestion - 1)
                                )
                              )
                            )
                          },
                          choiceValues: {
                            a!forEach(
                              items: enumerate(local!numberOfAnswers),
                              expression: index(
                                split(local!option, ","),
                                if(
                                  local!currentQuestion = 0,
                                  fv!item,
                                  fv!index + local!numberOfAnswers * (local!currentQuestion - 1)
                                )
                              )
                            )
                          },
                          label: fv!index & ".  " & fv!item,
                          labelPosition: "ABOVE",
                          
                          
                          value: local!selectedAnswer.SelectedAnswer[local!currentQuestion],
                          saveInto:
                          a!save(
                            local!selectedAnswer.SelectedAnswer[local!currentQuestion],
                            save!value
                          ),
                          
                          
                          validations: {},
                          choiceLayout: "STACKED",
                        )},)
                      
                    },
                    alignVertical: "TOP"
                  ),
                  a!sectionLayout(
                    label: "",
                    contents: {
                      a!richTextDisplayField(
                        label: "Correct Answer : ",
                        labelPosition: "ABOVE",
                        value: a!richTextItem(
                          text: {
                            a!forEach(
                              items: local!currentQuestion,
                              expression: index(
                                local!correctAnswer,
                                if(
                                  local!currentQuestion = 0,
                                  "",
                                  fv!index + 1 * (local!currentQuestion - 1)
                                )
                              )
                            )
    
                          },
                          color: "POSITIVE",
                          size: "MEDIUM",
                          style: "EMPHASIS"
                        ),
                        showWhen: local!submit
    
                      )
    
                    }
                  )
    
                }
    
              )
            )
          },
          marginBelow: "STANDARD"
    
        ),
        /*a!timeDisplayField(*/
        /*label:"Time Lapsed",*/
        /*value:time(now())*/
        /*),*/
        a!buttonArrayLayout(
          buttons: {
            a!buttonWidget(
              label: "Check Score",
              icon: "thumbs-up",
              iconPosition: "END",
              saveInto: {
    
                /*a!save(local!submit, save!value),*/
                /*a!save(ri!score.score,local!score)*/
              },
              /*submit: true,*/
    
              style: "GHOST"
            ),
            a!buttonWidget(
              label:"close",
              value:"close",
              saveInto: ri!buttonAction,
              submit:true,
              style: "SOLID"
    
    
            )
    
          },
          align: "CENTER"
    
        ),
        a!sectionLayout(
          labelColor: "POSITIVE",
          contents: {
            a!columnsLayout(
              columns: {
                a!columnLayout(
                  contents: {
                    a!richTextDisplayField(
                      labelPosition: "ADJACENT",
    
                      value:{a!richTextItem(
                        text: "Your Score is  ",
                        color: "ACCENT",
                        size: "LARGE",
                        style: "STRONG"
    
                      ),
                      a!richTextItem(
                        /*text: { local!score },*/
                        color: "ACCENT",
                        size: "LARGE",
                        style: "STRONG"
    
    
                      )},
                      showWhen: local!submit,
                      marginAbove: "STANDARD"
    
                    )
                  }
                )
    
              }
            )
          },
          isInitiallyCollapsed: true,
          dividerWeight: "MEDIUM",
          dividerColor: "ACCENT",
          marginAbove: "STANDARD"
        )
    
    
      }
    )

  • I'm not sure what you're trying to accomplish here (particularly since this is a rather old post at this point).

    A few issues when glancing at your code:

    1. neither your "value" nor your "saveInto" parameters in your CheckboxField are configured anything like my example above.  If you're not actually trying to do what my example did then I'm not clear why you're posting in this thread versus following up with Harshit and Stefan who were helping you the other day in your own brand new thread on this topic.
    2. I'm confused why you're using the "split()" function where you load "local!question" and "local!option".  If a rule returns an array, Appian's flattened plaintext rendering of that will be separated by semicolons, but the actual array data is not.  If your "fetch" query rules are returning flattened, semicolon-delineated strings instead of text arrays, then you have some big design issues.
    3. I'm confused why your Checkbox Field's "choiceValues" and "choiceLabels" parameters are both manually constructing their lists of options.  You should be setting these up as local variables then calling them directly from the checkbox field.