For array of objects, show items, choose one to edit or create new one

Hello,

Is it possible to display the list of items and choose an existing one or choose to create new one to edit the item selected in next step pages ? (In a stepper, for an array of objects)
Example :
Here is a part of my ui schema:

{
                type: "Category", 
                label: "Alternatives",
                elements : [
                 {
                     type: "HorizontalLayout", 
                     elements:[
                         {
                              type: "Control", 
                              scope: "#/properties/alternatives"
                         }
                      ]
                  }
                ]
            },
            {
             type: "Category", 
             label: "Canaux",
             elements : [
              {
                  type: "HorizontalLayout", 
                  elements:[
                      {
                           type: "Control", 
                           scope: "#/properties/alternatives/items/properties/channels"
                      }
                   ]
               }
             ] 
            },

I want here to chose an “alternative” (or choose to creat new one) and edit the channels in the next step of the form
I think I’ll have to create a custom renderer
But I don’t know if my need is possible with JSONFORMS

Thank you

Hi @fatbc, in general anything is possible with JSON Forms as you have full control in your custom renderers and render whatever you like.

I don’t think there is a way to accomplish what you want with the off-the-shelf renderers, so yes you would need custom renderers for this.

You might want to think about to handle this logic outside of JSON Forms, i.e. create your own stepper component and then render the content of each stepper with JSON Forms. This is usually the more natural choice over embedding very custom domain logic in custom renderers, emulating multiple forms in one.

1 Like