WordPress用户查询、分类展示及点击跳转详情页技术问询

Hey there! Let's tackle your user list search and detail page jump challenge step by step. I'll break this down into manageable parts, with a focus on solving that click-to-jump hurdle.

一、先实现按姓名搜索功能 #

First, we'll add a search form that filters the user list based on the name entered. We'll use a GET parameter to pass the search term and filter our user query accordingly.

二、核心难点：点击跳转详情页的实现 #

The key here is two-fold: generating a valid link for each user in the list, and creating a detail page that fetches and displays the user's info using their unique ID.

• Frontend Link Generation: For each user in your list, wrap their name (or the entire list item) in an <a> tag that points to your detail page, passing the user's ID as a URL parameter.
• Backend Detail Page: Create a separate page (like user-detail.php) that reads the user ID from the URL, fetches the corresponding user data, and renders the details.

三、完整代码示例 #

User List Page (with search) #

<?php
// Sanitize and get the search term from URL
$search_term = isset($_GET['search']) ? sanitize_text_field($_GET['search']) : '';

// Set up user query arguments with search filter
$user_args = array(
    'search'         => '*' . esc_attr($search_term) . '*',
    'search_columns' => array('display_name'), // Target the user's display name
    'number'         => -1 // Fetch all matching users
);
$blogusers = get_users($user_args);
?>

<!-- Search Form -->
<form method="get" action="<?php echo esc_url($_SERVER['REQUEST_URI']); ?>">
    <input 
        type="text" 
        name="search" 
        placeholder="Search by name..." 
        value="<?php echo esc_html($search_term); ?>"
    >
    <button type="submit">Search</button>
</form>

<!-- User List -->
<div class="user-list">
    <?php if (!empty($blogusers)) : ?>
        <ul>
            <?php foreach ($blogusers as $user) : ?>
                <li>
                    <!-- Jump link to detail page, passing user ID -->
                    <a href="user-detail.php?id=<?php echo intval($user->ID); ?>">
                        <?php echo esc_html($user->display_name); ?>
                    </a>
                </li>
            <?php endforeach; ?>
        </ul>
    <?php else : ?>
        <p>No users found matching your search.</p>
    <?php endif; ?>
</div>

User Detail Page (user-detail.php) #

<?php
// Validate and get the user ID from URL
$user_id = isset($_GET['id']) ? intval($_GET['id']) : 0;

// Check if ID is valid
if (!$user_id) {
    echo "<p>Invalid user ID.</p>";
    exit;
}

// Fetch user data by ID
$user = get_user_by('id', $user_id);

// Handle case where user doesn't exist
if (!$user) {
    echo "<p>User not found.</p>";
    exit;
}
?>

<!-- User Detail Display -->
<div class="user-detail">
    <h2><?php echo esc_html($user->display_name); ?>'s Details</h2>
    <div class="user-info">
        <p><strong>Full Name:</strong> <?php echo esc_html($user->display_name); ?></p>
        <p><strong>Email:</strong> <?php echo esc_html($user->user_email); ?></p>
        <p><strong>Username:</strong> <?php echo esc_html($user->user_login); ?></p>
        <!-- Add more user fields as needed (e.g., bio, registration date) -->
    </div>
</div>

关键注意事项 #

• Security First: Always sanitize user input (like the search term and user ID) to prevent XSS attacks and SQL injection. We use sanitize_text_field(), intval(), and esc_html() here to keep things safe.
• Path Adjustments: Make sure the href in the jump link matches your project's file structure. If your detail page is in a subdirectory, update the path accordingly.
• Custom Systems: If you're not using WordPress, replace get_users() and get_user_by() with your project's equivalent user query functions.

内容的提问来源于stack exchange，提问作者jord49