Question

Checkboxfield on user interface

Forum|Forum|4 years ago
April 6, 2022
6 replies
0 views

a!localVariables(
  local!additionalInfoRequired,
  local!cancelled,
  a!formLayout(
    contents:{
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: {"additional Info Required"},
        choiceValues: {true},
        value: if(local!additionalInfoRequired, true, null),
        saveInto: a!save(
          local!additionalInfoRequired,
          if(isnull(save!value), false, true),
          a!save(local!cancelled,false)
        ),
      ),
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: {"additional Info Required"},
        choiceValues: {true},
        value: if(local!cancelled, true, null),
        saveInto: a!save(
          local!cancelled,
          if(isnull(save!value), false, true)
        ),
      )
    },
    buttons:a!buttonLayout(
      primaryButtons:{
        a!buttonWidget(
          label:"Submit",
          submit: true
        )
      }
    )
  )
)

Hi,

My requirement is when I check one checkbox, another checkbox should uncheck(If checked already).

This functionality I am able to achieve with the attached code.

But, I am encountering an issue like, I was unable to "uncheck" the same selected checkbox.

If I remove the code line number 14 (a!save(local!cancelled,false)), then I am unable to fulfill my requirement.

If I use this line, then I am unable to uncheck the same checkbox which I selected.

Any advice, please.

Thanks.

interface

R

rolands0008

[deleted]

H

harikishorereddyc0001Author

If you double click on the same checkbox twice, it is returning an error.

peter.lewis

Employee

First to check - is it possible your paradigm can be met by using a dropdown or radio buttons? Those components already have a method of ensuring that only a single value is selected, so it might be easier than trying a more complicated solution with checkboxes.

That being said, I have a couple recommendations for making this work with the checkbox method:

First, I'd suggest using two different variables for each checkbox. It's much easier to identify what's happening and you can manage the variables independently.
I also recommend avoiding logic on the "value" parameter - personally I find it much easier to always make the value reference a variable directly, because then there is no ambiguity for what is displayed. Then, you simply need to apply the correct logic on the save to ensure the value is correct.

Here's my solution:

a!localVariables(
  local!additionalInfoRequired,
  local!additionalInfoRequired2,
  a!formLayout(
    contents:{
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: {"additional Info Required"},
        choiceValues: {true},
        value: local!additionalInfoRequired,
        saveInto: {
          local!additionalInfoRequired,
          if(
            and(
              local!additionalInfoRequired,
              local!additionalInfoRequired2
            ),
            a!save(
              target: local!additionalInfoRequired2,
              value: null
            ),
            {}
          )
        }
      ),
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: {"additional Info Required 2"},
        choiceValues: {true},
        value: local!additionalInfoRequired2,
        saveInto: {
          local!additionalInfoRequired2,
          if(
            and(
              local!additionalInfoRequired,
              local!additionalInfoRequired2
            ),
            a!save(
              target: local!additionalInfoRequired,
              value: null
            ),
            {}
          )
        }
      )
    },
    buttons:a!buttonLayout(
      primaryButtons:{
        a!buttonWidget(
          label:"Submit",
          submit: true
        )
      }
    )
  )
)

R

rolands0008

a!localVariables(
  local!additionalInfoRequired,
  local!cancelled,
  a!formLayout(
    contents: {
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: { "additional Info Required" },
        choiceValues: { true },
        value: if(
          local!cancelled,
          null,
          local!additionalInfoRequired
        ),
        saveInto: {
          a!save(
            local!additionalInfoRequired,
            if(local!additionalInfoRequired, null, true)
          ),
          a!save(
            local!cancelled,
            if(local!cancelled, false, null)
          )
        }
      ),
      a!checkboxField(
        labelPosition: "ABOVE",
        choiceLabels: { "additional Info Required" },
        choiceValues: { true },
        value: if(
          local!additionalInfoRequired,
          null,
          local!cancelled
        ),
        saveInto: {
          a!save(
            local!cancelled,
            if(local!cancelled, null, true)
          ),
          a!save(
            local!additionalInfoRequired,
            if(local!additionalInfoRequired, false, null)
          )
        }
      )
    },
    buttons: a!buttonLayout(
      primaryButtons: {
        a!buttonWidget(label: "Submit", submit: true)
      }
    )
  )
)

My previous replies were marked as spams for a reason.. Nevermind.

I'm posting again the fixed version with the variables you had in your code.