This how-to explains how you can create overview and detail pages in Mendix. 

1. Preparation

  • Before you can create those pages you need to setup a basic data structure using this how-to.

2. Creating an Overview Page

This section will explain how you can add a new overview page to your project.

  1. Right click the module and select Add > Page.

  2. Click on Responsive.
  3. Enter _CustomerOverview_as Page name.
  4. Select Sidebar_Full_Responsive as navigation layout.
  5. Click on Blank.
  6. Select Blank Page Template.
  7. Click once on Data Grid in the menu bar of the page builder to select the Data Grid widget.
  8. Click once in the page editor to create the Data grid widget.
  9. Right click the data grid.
  10. Click Select Entity in the context menu.
  11. Select the Customer entity in the Data Source Selector and click Select.
  12. Click OK to auto-fill the data grid with search fields and columns.

You should now have an overview page like this:

3. Creating a Detail Page

  1. Right click the New button of the data grid on the overview page
  2. Select Generate page.
  3. Select PopupLayout as navigation layout.
  4. Select Form basic horizontal and click OK.  
  5. Right click the New button of the data grid in the overview page again
  6. Select Go to page. You should now have a detail page like this:

4. Navigation and Security

  1. Now create a navigation item for your overview page to start using it. If you don’t know how to setup the navigation structure, take a look at this how-to.
  2. If you switched on security for this application you need to configure page access on both the overview and detail pages. If you don’t know how to configure page access, take a look at this how-to.

How-to’s

Reference Guide