cascading Mutiple DropDown Dependancy

We have a use case where we need to display values in multiple drop down(say a) based on the previous multiple drop down (say b) values, there is no constrain as to which drop down should selected first. 

user can select any drop down and the other drop down should display value based on it. but when multiple values are selected, for each value the save into is executed and the drop down variables are refreshed and it is throwing an error.

It is either picking up only the first value and nullifying all the others , or it is nullfying the entire choice values. 

Interface Definition: Expression evaluation error at function a!multipleDropdownField [line 219]: A multiple dropdown component [label=“”] has an invalid value for “choiceValues”. Choice values cannot be null.

Please suggest as to what can be done to find out when all the values are saved into the variable in multiple dropdown

P.S we do not have buttons so all values should be calculated based on save into if dropdown alone

  Discussion posts and replies are publicly visible

Parents
  • 0
    Certified Lead Developer

    Can you post a code snippet for what you have so far?  (Please use "Insert" --> "Insert Code" to create a code box).  There are a lot of possibilities for what the issue could be so we'll need to narrow it down a bit if we can.

  • hi mike my code is somewhat similar to this, but the problem is multiple dropdown saves the value one by one into an array, hence when the first value is saved, the refresh to my other filters are happening, Kindly suggest a way to  find out when my save into for all user selected values will be completed, so that post completion i can refresh my other dropdown values.

    load(
      local!dropdownOneLabels: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoLabels: {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!dropdownOneValues: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoValues:  {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!tmpDropdownOneLabels,
      local!tmpDropdownTwoLabels,
      local!tmpDropdownOneValues,
      local!tmpDropdownTwoValues,
      local!dropdownOne,
      local!dropdownTwo,
      with(
        {
          a!multipleDropdownField(
            label: "Dropdown One",
            labelPosition: "ABOVE",
            placeholder: "-- Select values in Dropdown One --",
            choiceLabels: if(or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
            local!dropdownOneLabels,
            local!tmpDropdownOneLabels
            ),
            choiceValues: if(or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
            local!dropdownOneLabels,
            local!tmpDropdownOneLabels
            ),
            value: local!dropdownOne,
            saveInto: {
              local!dropdownOne,
              a!save(
                local!dropdownTwo,
                {}
              ),
              a!save(
                local!tmpDropdownTwoLabels,
                index(local!dropdowntwoLabels,wherecontains(
                 local!dropdownOne,
                 local!dropdownOneValues,             
                ),{})
              ),
              a!save(local!dropdownTwo, local!tmpDropdownTwoLabels),
              /*a!save(*/
                /*local!tmpDropdownTwoValues,*/
                /*index(local!dropdowntwoLabels,wherecontains(*/
                  /*local!dropdownOne,*/
                  /*local!dropdownOneValues,             */
                /*),{})*/
                /*index(*/
                  /*local!dropdownTwoValues,*/
                  /*local!dropdownOne,*/
                  /*{}*/
                /*)*/
              /*)*/
            }
          ),
          a!multipleDropdownField(
            label: "Dropdown Two",
            labelPosition: "ABOVE",
            placeholder: "-- Select values in Dropdown Two --",
            choiceLabels: if(or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
            local!dropdownTwoLabels,
            local!tmpDropdownTwoLabels
            ),
            choiceValues: if(or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
            local!dropdownTwoLabels,
            local!tmpDropdownTwoLabels
            ),
            value: local!dropdownTwo,
            saveInto: {
              local!dropdownTwo,
              a!save(
                local!dropdownOne,
                {}
              ),
              a!save(
                local!tmpDropdownOneLabels,
                index(local!dropdownOneLabels,wherecontains(
                  local!dropdownTwo,
                  local!dropdownTwoValues,             
                ),{})
               
              ),
              a!save(local!dropdownOne,local!tmpDropdownOneLabels),
              a!save(
                local!tmpDropdownOneValues,
                index(
                  local!dropdownOneValues,
                  local!dropdownTwo,
                  {}
                )
              )
            }
          )
        }
      )
    )

Reply
  • hi mike my code is somewhat similar to this, but the problem is multiple dropdown saves the value one by one into an array, hence when the first value is saved, the refresh to my other filters are happening, Kindly suggest a way to  find out when my save into for all user selected values will be completed, so that post completion i can refresh my other dropdown values.

    load(
      local!dropdownOneLabels: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoLabels: {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!dropdownOneValues: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoValues:  {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!tmpDropdownOneLabels,
      local!tmpDropdownTwoLabels,
      local!tmpDropdownOneValues,
      local!tmpDropdownTwoValues,
      local!dropdownOne,
      local!dropdownTwo,
      with(
        {
          a!multipleDropdownField(
            label: "Dropdown One",
            labelPosition: "ABOVE",
            placeholder: "-- Select values in Dropdown One --",
            choiceLabels: if(or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
            local!dropdownOneLabels,
            local!tmpDropdownOneLabels
            ),
            choiceValues: if(or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
            local!dropdownOneLabels,
            local!tmpDropdownOneLabels
            ),
            value: local!dropdownOne,
            saveInto: {
              local!dropdownOne,
              a!save(
                local!dropdownTwo,
                {}
              ),
              a!save(
                local!tmpDropdownTwoLabels,
                index(local!dropdowntwoLabels,wherecontains(
                 local!dropdownOne,
                 local!dropdownOneValues,             
                ),{})
              ),
              a!save(local!dropdownTwo, local!tmpDropdownTwoLabels),
              /*a!save(*/
                /*local!tmpDropdownTwoValues,*/
                /*index(local!dropdowntwoLabels,wherecontains(*/
                  /*local!dropdownOne,*/
                  /*local!dropdownOneValues,             */
                /*),{})*/
                /*index(*/
                  /*local!dropdownTwoValues,*/
                  /*local!dropdownOne,*/
                  /*{}*/
                /*)*/
              /*)*/
            }
          ),
          a!multipleDropdownField(
            label: "Dropdown Two",
            labelPosition: "ABOVE",
            placeholder: "-- Select values in Dropdown Two --",
            choiceLabels: if(or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
            local!dropdownTwoLabels,
            local!tmpDropdownTwoLabels
            ),
            choiceValues: if(or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
            local!dropdownTwoLabels,
            local!tmpDropdownTwoLabels
            ),
            value: local!dropdownTwo,
            saveInto: {
              local!dropdownTwo,
              a!save(
                local!dropdownOne,
                {}
              ),
              a!save(
                local!tmpDropdownOneLabels,
                index(local!dropdownOneLabels,wherecontains(
                  local!dropdownTwo,
                  local!dropdownTwoValues,             
                ),{})
               
              ),
              a!save(local!dropdownOne,local!tmpDropdownOneLabels),
              a!save(
                local!tmpDropdownOneValues,
                index(
                  local!dropdownOneValues,
                  local!dropdownTwo,
                  {}
                )
              )
            }
          )
        }
      )
    )

Children
  • 0
    Certified Lead Developer
    in reply to Vasundaraa Ramesh

    My only suggestion here is that you make the user click a button or link (such as in a side-by-side-layout next to each multiple dropdown) which populates the selected items into the variable that affects the other dropdown.  So basically from this example, every part of the saveInto other than the very first line of both of the current ones, would be done somewhere else.

  • 0
    Certified Lead Developer
    in reply to Vasundaraa Ramesh

    Please find attached my example, which is a new version of the one you pasted just above, but with my suggestion incorporated:

    load(
      local!dropdownOneLabels: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoLabels: {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!dropdownOneValues: {1, 2, 3, 4, 5, 6, 7, 8, 9, 10},
      local!dropdownTwoValues:  {"One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten"},
      local!tmpDropdownOneLabels,
      local!tmpDropdownTwoLabels,
      local!tmpDropdownOneValues,
      local!tmpDropdownTwoValues,
      local!dropdownOne,
      local!dropdownTwo,
      
      {
        
        a!sideBySideLayout(
          alignVertical: "MIDDLE",
          items: {
            a!sideBySideItem(
              width: "2X",
              item: a!multipleDropdownField(
                label: "Dropdown One",
                labelPosition: "ABOVE",
                placeholder: "-- Select values in Dropdown One --",
                choiceLabels: if(
                  or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
                  local!dropdownOneLabels,
                  local!tmpDropdownOneLabels
                ),
                choiceValues: if(
                  or(rule!APN_isEmpty(local!dropdownTwo), rule!APN_isEmpty(local!tmpDropdownOneLabels)),
                  local!dropdownOneLabels,
                  local!tmpDropdownOneLabels
                ),
                value: local!dropdownOne,
                saveInto: {
                  local!dropdownOne,
                  /*a!save(*/
                    /*local!dropdownTwo,*/
                    /*{}*/
                  /*),*/
                  /*a!save(*/
                    /*local!tmpDropdownTwoLabels,*/
                    /*index(*/
                      /*local!dropdowntwoLabels,*/
                      /*wherecontains(*/
                        /*local!dropdownOne,*/
                        /*local!dropdownOneValues,             */
                      /*),*/
                      /*{}*/
                    /*)*/
                  /*),*/
                  /*a!save(local!dropdownTwo, local!tmpDropdownTwoLabels)*/
                }
              )
            ),
            a!sideBySideItem(
              width: "1X",
              item: a!richtextdisplayfield(
                value: a!richTextItem(
                  text: {
                    a!richTextIcon(icon: "save", size: "MEDIUM_PLUS", caption: "Save")
                  },
                  link: a!dynamicLink(
                    saveInto: {
                      a!save(
                        local!dropdownTwo,
                        {}
                      ),
                      a!save(
                        local!tmpDropdownTwoLabels,
                        index(
                          local!dropdowntwoLabels,
                          wherecontains(
                            local!dropdownOne,
                            local!dropdownOneValues,             
                          ),
                          {}
                        )
                      ),
                      a!save(local!dropdownTwo, local!tmpDropdownTwoLabels)
                    }
                  ),
                  linkStyle: "STANDALONE"
                )
              )
            )
          }
        ),
        
        a!sideBySideLayout(
          alignVertical: "MIDDLE",
          items: {
            a!sideBySideItem(
              width: "2X",
              item: a!multipleDropdownField(
                label: "Dropdown Two",
                labelPosition: "ABOVE",
                placeholder: "-- Select values in Dropdown Two --",
                choiceLabels: if(
                  or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
                  local!dropdownTwoLabels,
                  local!tmpDropdownTwoLabels
                ),
                choiceValues: if(
                  or(rule!APN_isEmpty(local!dropdownOne), rule!APN_isEmpty(local!tmpDropdownTwoLabels)),
                  local!dropdownTwoLabels,
                  local!tmpDropdownTwoLabels
                ),
                value: local!dropdownTwo,
                saveInto: {
                  local!dropdownTwo,
                  /*a!save(*/
                    /*local!dropdownOne,*/
                    /*{}*/
                  /*),*/
                  /*a!save(*/
                    /*local!tmpDropdownOneLabels,*/
                    /*index(*/
                      /*local!dropdownOneLabels,*/
                      /*wherecontains(*/
                        /*local!dropdownTwo,*/
                        /*local!dropdownTwoValues,             */
                      /*),*/
                      /*{}*/
                    /*)*/
                  /*),*/
                  /*a!save(local!dropdownOne,local!tmpDropdownOneLabels),*/
                  /*a!save(*/
                    /*local!tmpDropdownOneValues,*/
                    /*index(*/
                      /*local!dropdownOneValues,*/
                      /*local!dropdownTwo,*/
                      /*{}*/
                    /*)*/
                  /*)*/
                }
              )
            ),
            a!sideBySideItem(
              width: "1X",
              item: a!richtextdisplayfield(
                value: a!richTextItem(
                  text: {
                    a!richTextIcon(icon: "save", size: "MEDIUM_PLUS", caption: "Save")
                  },
                  link: a!dynamicLink(
                    saveInto: {
                      a!save(
                        local!dropdownOne,
                        {}
                      ),
                      a!save(
                        local!tmpDropdownOneLabels,
                        index(
                          local!dropdownOneLabels,
                          wherecontains(
                            local!dropdownTwo,
                            local!dropdownTwoValues,             
                          ),
                          {}
                        )
                      ),
                      a!save(local!dropdownOne,local!tmpDropdownOneLabels),
                      a!save(
                        local!tmpDropdownOneValues,
                        index(
                          local!dropdownOneValues,
                          local!dropdownTwo,
                          {}
                        )
                      )
                    }
                  ),
                  linkStyle: "STANDALONE"
                )
              )
            )
          }
        )
      }
    )

    Also note I've removed the with() statement here as it wasn't actually doing anything.