Create a list with ajax form to add items

If you have a list of items and want to quickly add more with an ajax add form, this is how to set it up.

I used the Simplify module and Form Block to get a compact add form for an Item content type.

Create a View of Items that reference a Collection content type. Set up the contextual filter for the collection Id so we can place this on the collection page using layout builder.

Here is the form and view:

Add item form with view

Now use the Entity Populate module to set the Collection reference field on the Item to use the Collection nid from the url. You will need to use the Current Page Entity Tokens module to use the token below. You can also use the url arg token here.

target_id: '[current-page:node:nid]'

 

Now enable the Ajax Form Entity module and configure it for Item. You should end up with a working list and form like the pic, with the item added to the list when you click save.

Tags