Master-Details in PHP

What is Master-Details?

Master-Details is a UI pattern that displays a list of items (master) alongside detailed information about a selected item (details).
Common examples include email clients, product catalogs, and user management systems.

Common Implementation Patterns

There are several ways to implement the Master-Details pattern. The examples below use the URL parameter approach.

1. Single Page Approach

Both master list and details display on the same page:

Master list always visible.
Details panel updates based on selection.
Uses URL parameters for item selection.

2. Separate Pages Approach

Master and details on different pages:

Master page shows the list.
Clicking an item navigates to details page.
Requires back navigation to return to list.

3. AJAX Approach

Dynamic loading without page refresh:

Master list loads initially.
Details load via JavaScript/AJAX.
Smoother user experience.

Step 1: Plan Your Database Structure

Design tables with a clear relationship between master and detail records:

CREATE TABLE products (
    id INT PRIMARY KEY AUTO_INCREMENT,
    name VARCHAR(255) NOT NULL,
    category VARCHAR(100),
    description TEXT,
    price DECIMAL(10, 2)
);

Step 2: Create the Master List

Display items in a summary format with links to view details:

1
// Connect to database
2
$pdo = new PDO('mysql:host=localhost;dbname=store', 'user', 'password');
3

4
// Fetch only the columns needed for the list
5
$stmt = $pdo->query("SELECT id, name, category FROM products");
6
$products = $stmt->fetchAll(PDO::FETCH_ASSOC);
7

8
// Display each product as a link
9
foreach ($products as $product) {
10
    $id = htmlspecialchars($product['id']);
11
    $name = htmlspecialchars($product['name']);
12
    echo "<a href='?id=$id'>$name</a><br>";
13
}

Step 3: Handle Item Selection

Use URL parameters to identify which item to display. Always validate the input:

1
// Validate the ID parameter (must be a positive integer)
2
$selected_id = filter_input(INPUT_GET, 'id', FILTER_VALIDATE_INT);
3

4
if ($selected_id) {
5
    // Use prepared statement to prevent SQL injection
6
    $stmt = $pdo->prepare("SELECT * FROM products WHERE id = ?");
7
    $stmt->execute([$selected_id]);
8
    $selected_item = $stmt->fetch(PDO::FETCH_ASSOC);
9

10
    // Handle case where item doesn't exist
11
    if (!$selected_item) {
12
        echo "<p>Product not found.</p>";
13
    }
14
}

Step 4: Display Details Panel

Show comprehensive information about the selected item with proper output escaping:

1
if (isset($selected_item) && $selected_item) {
2
    echo "<h2>" . htmlspecialchars($selected_item['name']) . "</h2>";
3
    echo "<p>Category: " . htmlspecialchars($selected_item['category']) . "</p>";
4
    echo "<p>Price: $" . htmlspecialchars($selected_item['price']) . "</p>";
5
    echo "<p>" . htmlspecialchars($selected_item['description']) . "</p>";
6
    echo "<a href='?'>Back to list</a>";
7
}

Allow users to move between items:

1
// Get adjacent product IDs
2
$stmt = $pdo->prepare("SELECT id FROM products WHERE id < ? ORDER BY id DESC LIMIT 1");
3
$stmt->execute([$selected_id]);
4
$prev = $stmt->fetch();
5

6
$stmt = $pdo->prepare("SELECT id FROM products WHERE id > ? ORDER BY id ASC LIMIT 1");
7
$stmt->execute([$selected_id]);
8
$next = $stmt->fetch();
9

10
// Display navigation links
11
if ($prev) echo "<a href='?id={$prev['id']}'>Previous</a> ";
12
if ($next) echo "<a href='?id={$next['id']}'>Next</a>";

Step 6: Add Search and Filtering

Enable users to filter the master list:

1
// Get filter parameters
2
$search = $_GET['search'] ?? '';
3
$category = $_GET['category'] ?? '';
4

5
// Build query with filters
6
$sql = "SELECT id, name, category FROM products WHERE 1=1";
7
$params = [];
8

9
if ($search) {
10
    $sql .= " AND name LIKE ?";
11
    $params[] = "%$search%";
12
}
13
if ($category) {
14
    $sql .= " AND category = ?";
15
    $params[] = $category;
16
}
17

18
$stmt = $pdo->prepare($sql);
19
$stmt->execute($params);
20
$products = $stmt->fetchAll(PDO::FETCH_ASSOC);

Common Mistakes

Not validating the ID parameter - Using $_GET['id'] directly allows SQL injection. Always use filter_input() or validate manually.
Missing output escaping - Displaying database values without htmlspecialchars() creates XSS vulnerabilities.
Loading all data in the master list - Fetching every column for the list view wastes memory. Select only what you need to display.
Not handling missing items - Users can manually change the URL. Always check if the requested item exists before displaying it.
Using string concatenation in queries - This creates SQL injection risks. Use prepared statements with parameter binding.