Skip to main content
December 13, 2021
Solved

Custom Picker Field Null and Not Saving

  • December 13, 2021
  • 4 replies
  • 0 views

Hello, 

I posted a couple of minutes ago about a dropdown field doing something similar to this except now it is a custom picker field. I put the code below although you cant test because it has a rule in it. If you want you its just countries so you can use USA, UNK, GER etc. The issue is that I need to save the value into the local variable array. Every time I select a option it just deletes the option and I have surmised it comes out of the issue of list of text vs list of null because list of null sets it to be blank and you can pick but list of text fills it with blanks regardless of null value being present in list of text. 


Here is the code: 

a!localVariables(
  local!pubProdCtry: cast(typeof({null}), repeat(4, null())),
  local!dataProdCtry1: cast(typeof({null}), repeat(4, null())),
  local!count: 1,
  local!datacount: 1,
  local!primary1: repeat(4, null),
  local!primary2: repeat(4, null),
  {
    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!count),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!queryCountriesAutocomplete(_),
                    selectedLabels: cast(typeof({""}), local!pubProdCtry[fv!index]),
                    value: cast(typeof({""}), local!pubProdCtry[fv!index]),
                    saveInto: local!pubProdCtry[fv!index],
                    required: true,
                  ),
                },
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary1[fv!index]),
                    saveInto: {local!primary1[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!count - 1,
                      saveInto: local!count,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!count + 1,
                      saveInto: local!count,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        ),
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),

    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!datacount),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Data Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!queryCountriesAutocomplete(_),
                    selectedLabels: cast(typeof({""}), local!dataProdCtry1[fv!index]),
                    value: cast(typeof({""}), local!dataProdCtry1[fv!index]),
                    saveInto: local!dataProdCtry1[fv!index],
                    required: true
                  )
                }
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary2[fv!index]),
                    saveInto: {local!primary2[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!datacount - 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!datacount + 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        )
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),
  }
)

Best answer by hrishikeshd997

Below code should work (for adding up to 4 values). For the suggestFunction use the one from  "Configure an Array Picker" SAIL recipe

https://docs.appian.com/suite/help/21.4/recipe-configure-an-array-picker.html

a!localVariables(
  local!pubProdCtry: cast(typeof({""}), repeat(4, null())),
  local!dataProdCtry1: cast(typeof({""}), repeat(4, null())),
  local!count: 1,
  local!datacount: 1,
  local!primary1: repeat(4, null),
  local!primary2: repeat(4, null),
  local!allCountryLabels: {"USA", "UK", "India"},
  local!allCountryAbbreviations: {"USA", "UK", "India"},
  {
    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!count),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!TH_arrayPicker(
                      filter:_ , 
                      labels: local!allCountryLabels, 
                      identifiers: local!allCountryAbbreviations
                    ),
                    selectedLabels: a!forEach(
                      items: local!pubProdCtry[fv!index],
                      expression: index(local!allCountryLabels, wherecontains(fv!item, local!allCountryAbbreviations))
                    ),
                    value: local!pubProdCtry[fv!index],
                    saveInto: local!pubProdCtry[fv!index]
                  ),
                },
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary1[fv!index]),
                    saveInto: {local!primary1[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!count - 1,
                      saveInto: local!count,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!count + 1,
                      saveInto: local!count,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        ),
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),

    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!datacount),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Data Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!TH_arrayPicker(
                      filter:_ , 
                      labels: local!allCountryLabels, 
                      identifiers: local!allCountryAbbreviations
                    ),
                    selectedLabels: a!forEach(
                      items: local!dataProdCtry1[fv!index],
                      expression: index(local!allCountryLabels, wherecontains(fv!item, local!allCountryAbbreviations))
                    ),
                    value: local!dataProdCtry1[fv!index],
                    saveInto: local!dataProdCtry1[fv!index],
                    required: true
                  )
                }
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary2[fv!index]),
                    saveInto: {local!primary2[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!datacount - 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!datacount + 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        )
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),
  }
)

4 replies

December 13, 2021

Below code should work (for adding up to 4 values). For the suggestFunction use the one from  "Configure an Array Picker" SAIL recipe

https://docs.appian.com/suite/help/21.4/recipe-configure-an-array-picker.html

a!localVariables(
  local!pubProdCtry: cast(typeof({""}), repeat(4, null())),
  local!dataProdCtry1: cast(typeof({""}), repeat(4, null())),
  local!count: 1,
  local!datacount: 1,
  local!primary1: repeat(4, null),
  local!primary2: repeat(4, null),
  local!allCountryLabels: {"USA", "UK", "India"},
  local!allCountryAbbreviations: {"USA", "UK", "India"},
  {
    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!count),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!TH_arrayPicker(
                      filter:_ , 
                      labels: local!allCountryLabels, 
                      identifiers: local!allCountryAbbreviations
                    ),
                    selectedLabels: a!forEach(
                      items: local!pubProdCtry[fv!index],
                      expression: index(local!allCountryLabels, wherecontains(fv!item, local!allCountryAbbreviations))
                    ),
                    value: local!pubProdCtry[fv!index],
                    saveInto: local!pubProdCtry[fv!index]
                  ),
                },
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary1[fv!index]),
                    saveInto: {local!primary1[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!count - 1,
                      saveInto: local!count,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!count + 1,
                      saveInto: local!count,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        ),
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),

    a!cardLayout(
      contents: {
        a!forEach(
          items: enumerate(local!datacount),
          expression: 
          a!columnsLayout(
            columns: {
              a!columnLayout(
                contents: {
                  a!pickerFieldCustom(
                    label: "Data Producing Country",
                    labelPosition: "ABOVE",
                    placeholder: "--- Search by Name or GENC 3 ---",
                    maxSelections: 1,
                    suggestFunction: rule!TH_arrayPicker(
                      filter:_ , 
                      labels: local!allCountryLabels, 
                      identifiers: local!allCountryAbbreviations
                    ),
                    selectedLabels: a!forEach(
                      items: local!dataProdCtry1[fv!index],
                      expression: index(local!allCountryLabels, wherecontains(fv!item, local!allCountryAbbreviations))
                    ),
                    value: local!dataProdCtry1[fv!index],
                    saveInto: local!dataProdCtry1[fv!index],
                    required: true
                  )
                }
              ),
              a!columnLayout(
                contents: {
                  a!checkboxField(
                    label: "Primary",
                    labelPosition: "ABOVE",
                    choiceLabels: {""},
                    choiceValues: {true},
                    value: toboolean(local!primary2[fv!index]),
                    saveInto: {local!primary2[fv!index]},
                    choiceLayout: "COMPACT",
                    choiceStyle: "STANDARD",
                    validations: {},
                    align: "CENTER"
                  )
                },
                width: "EXTRA_NARROW" 
              )
            }
          )
        ),
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Remove",
                      icon: "minus",
                      value: local!datacount - 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      style: "LINK"
                    )
                  },
                  align: "END"
                )
              },
              width: "AUTO"
            ),
            a!columnLayout(
              contents: {
                a!buttonArrayLayout(
                  buttons: {
                    a!buttonWidget(
                      label: "Add",
                      icon: "plus",
                      value: local!datacount + 1,
                      saveInto: local!datacount,
                      size: "SMALL",
                      width: "MINIMIZE",
                      style: "LINK"
                    )
                  },
                  align: "END",
                  marginBelow: "STANDARD"
                )
              },
              width: "EXTRA_NARROW"
            )
          }
        )
      },
      height: "AUTO",
      style: "NONE",
      marginBelow: "STANDARD"
    ),
  }
)

kyleg0003Author
December 13, 2021

The above solution did not work for me. It still has the same issue of clicking on something and then not saving that to the local variable. 

December 13, 2021

Did you update the way you had initialized the locals before i.e. use empty string instead of null and then remove the use of cast from your save. Also did you use the suggest function from the recipe that was shared earlier. This should give the expected result as below -