Master/Detail Examples/Patterns - any?

I’m losing my mind looking for a basic example of a master/detail type of UI. We’re looking to port over to Meteor but most of our apps have a master/detail approach. example: Top pane lists 10 invoices in a grid. Click on one to select it and the full detail shows below (including data from other Collections that key on the invoice _id).

This seems so basic but I can’t find any recommendations on best practices. We have some things working but they feel like hacks and have introduced strange complexities (e.g. can’t edit the Detail and save it with ease).

Any guidance folks? Failing that is anyone willing to create some guidance that we can share with the community as a best practice?

Two important questions:

  1. Is this a readonly master/detail, or are we discussing a form where you edit line items of e.g. an invoice
  2. Are you using blaze, react, or angular for your ui layer?

Quick answer: if you are using react, https://github.com/tomRedox/simpleCRM might be a good example app to take cues from

1 Like

not read only - we’ll be adding and editing in the detail area.

Blaze is where we are now but I can talk to the crew about React. I’m going to look at the simpleCRM example! thanks!

I can’t recall of a blaze example that you can take a quick look at, but you might design your schemas to contain the line items within the invoice document and leverage autoform.

To be frank, the exact solution you would need, dependes very much on how you have currently structured your schemas and ui. So these may or may not work for you. But if you can perhaps share some code, we could talk specifics.

1 Like