Smart-action collection

Help me!
1

Context

Usage of the Collection field type allows users to only select one entity and it is not possible to select multiple. To achieve multiple selection I’m required to use dropdown with manual search queries (that’s fine).
Requested feature from my client was - to be able to select an entity (via collection or dropdown) and then this entity will create new field/set of fields in the form to manipulate it
e.g. When form opens I do have 2 fields (Collection, Checkbox), that have label Entity #1 and EntityCheckbox #1. Then select an entity via Collection field and when this field is selected, I would like to adjust the form to add new set of fields below first set, with names Entity #2, EntityCheckbox #2. I have tried to do this via pushing this items to a form array, replacing the form array with new, generating it via a function.
Is it possible to add new fields to the from on the fly? Or I need to pre-populate it with some amount of fields and just show them with a condition (not a solution for me)?

  • Agent technology: nodejs
  • Agent (forest package) name & version: latest
  • Database type: PostgreSQL
2

Hello @nike1v,

I suppose this is a follow up to the previous discussion we had about dynamic forms.
I tried to implement something in the way you have described, it is rudimentary but it seems to work fine.

Adding and removing elements from the list updates the form as expected:
image
=>
image

Here is the snippet for the action:

        .addAction("Dynamic form", {
          scope: "Single",
          form: (context) => {
            const form = [
              {
                label: "Orders",
                type: "NumberList",
                widget: "Dropdown",
                isRequired: true,
                options: async (actionContext) => {
                  const orders = await actionContext.dataSource
                    .getCollection("orders")
                    .list({}, ["id"]);

                  return orders.map(({ id }) => id);
                },
              },
            ];

            if (context.formValues['Orders'] && context.formValues['Orders'].length > 0) {
              context.formValues['Orders'].forEach(order => {
                form.push({
                  label: `Check this for order#${order}`,
                  type: 'Boolean',
                  widget: 'Checkbox',
                })
              })
            } 

            return form;
          },
          execute: async (context, resultBuilder) => {
            ...
          },
        })
1 Like
3

Ok, I see how you done it, I’ll try to copy this again if it works and come back to you!
Thanks again, @dogan.ay !

1 Like
4

It did the trick for me, thanks. Weird that i have tried to do almost the same, but instead of checking the values of the array, I relied on existing objects in the form array.
Btw, thank you again!

1 Like
5

Glad that I was able to help! :smiley: