Dropdown with a create new button

Hi, Can I have a button inside of a dropdown? 

Thanks in advance

  Discussion posts and replies are publicly visible

  • No, this isn't possible.

    Did you want to further explore what you are trying to do or is it enough just knowing if a dropdown can have a separate button like you've modelled?

  • 0
    Certified Lead Developer

    I do not see why you would need a button inside a dropdown for this. You could add this as the last option, and then make your UI react on this in a way the user can create a new item. Should not be much of a challenge.

  • 0
    Certified Senior Developer

    I agree with   that a button inside a dropdown isn't possible, but you could always use the last option to mock this behavior.  In my opinion this isn't the best approach, but check the code below for a quick example.

    a!localVariables(
      
      local!existingProjects: a!forEach(
        items: enumerate(3)+1,
        expression: {
          id: fv!index,
          projectName: "project " & fv!item,
          description: repeat(fv!index, "words and ")
        }
      ),
      
      local!dropdownOptions: append(
        local!existingProjects.projectName,
        "Create New"
      ),
      local!a: length(local!existingProjects)+1,
      local!selection,
      
      
      {
        a!dropdownField(
          label: "Project: ",
          choiceValues: local!dropdownOptions,
          choiceLabels: local!dropdownOptions,
          value: local!selection,
          saveInto: {
            local!selection,
            a!save(
              local!existingProjects,
              if(
                save!value = "Create New",
                append(
                  local!existingProjects,
                  {
                    id: length(local!existingProjects)+1,
                    projectName: "project " & length(local!existingProjects)+1
                  }
                ),
                local!existingProjects
              )
            )
          },
          placeholder: "select project"
        ),
        
        a!gridField(
          label: "Current Projects",
          data: local!existingProjects,
          columns: {
            a!gridColumn(
              label: "ID",
              sortField: "id",
              value: fv!row.id
            ),
            a!gridColumn(
              label: "Project Name",
              sortField: "projectName",
              value: fv!row.projectName
            ),
            a!gridColumn(
              label: "Description",
              sortField: "description",
              value: fv!row.description
            ),
          }
        )
      }
    )

    You may want to check out Editable Grid Component as an alternate approach.  Appian even has a recipe showing how to configure adding new rows/records to the gridLayout.

    Hope this helps

  • 0
    Certified Lead Developer
    in reply to Zakary Melvin

    I agree .
    Their is always a way around which we customize in Appian.
    if you could specify your use case it would help more in better solution.