Use Case: Filtering other lists by a list detail block’s data
You can filter lists of records by a lists detail’s record data
Use Case
You can use the data available in a list detail block to filter other lists on the same page. This is incredibly helpful in a variety of situations:
-
Filter a list of line items that belong to an order
-
Show a list of tasks that belong to a project
-
Display all of the contacts that belong to a selected company
-
Show all files uploaded by a specific user
-
… and many, many, many more.
Setup
Creating the main list
This list will serve as the main record type the user will be selecting and can live on any page in your app. In the example below, we have a very simple Home page with a simple card list of Projects being pulled from Airtable. The cards have an action setup that when a user clicks on a card, it takes them to a details page in the app called “Project details”.
You can use any type of list, table, or even Calendar and Kanban blocks for this. Anywhere you have records listed, you can link to a details screen.
Creating the list details page
When you set up the main list and create the “on click” action, you will be asked to link to a details page for that item. If one doesn’t exist, you can also create one. In the example below, we have a “Project details” page with a very simply Item Details block showing the project image, name, client name, and status. You’ll notice that Softr prompts us with a dialog at the bottom of the screen to add items that may be linked to a project such as Tasks and Users.
Adding linked lists
We can either click Add in the dialog at the bottom of the page or we can also add lists to the page manually, which is what we will do here. Below you can see that we added a “List with small cards” block below the detail block for the project and set the source to be “Users”.
We also added a conditional filter stating that we only wanted to see Users where their “Projects Assigned” includes any of the Current Record’s → Project Name. This will ensure that no matter which project is selected from the main list, this list of team members (Users) will only show the people who have been assigned to the specific project, regardless of which project is being viewed.
Now let’s add one more linked list to view the Tasks associated with this project detail. Below we added a basic “Table” block with the source set to Tasks and also added a conditional filter stating that we should only show Tasks where the Project Name is the same as the Current Record’s → Project Name. This ensures that only tasks belonging to the selected project are seen here in the table.
FAQ
Click on a toggle to reveal the answer.
Can I have multiple list details blocks on the same page?
Yes! But linked lists will only ever be able to be filtered by the first list detail block at the top-most part of the page. If you need to filter multiple lists by different type of records and list details blocks, we recommend creating separate pages for that.
My list is saying no items found, what can I do?
Conditional filters are case and field sensitive, so make sure your conditional filters make sense. For example, if you’re matching Project Name with a task’s Project Name, make sure those two values are actually the same in your data source.
Is there a limit to how many linked lists I can have on a list detail page?
Can I do this with charts as well?
Absolutely!
I need people to see more details about an item in a linked list, what can I do?
The same as the main list, you can add a details page for items in linked lists that people can click on to see more info, either by linking to a new page, opening a modal, or even linking out to an external URL.
Can I let people edit or create records using the current record’s data?
Yes, you can use Hidden Fields to capture information about the current record and save it as part of a different record type. Check out this example of a Job Submission form.