如何在Razor Pages中让下拉菜单提交后显示员工姓名而非ID？

Got it, let's tackle this problem step by step. You're storing the employee ID in your Service_Request_Information record, but want to display the name on the Index page without using a controller—totally doable with Razor Pages and EF Core. Here are two straightforward approaches:

Approach 1: Use EF Core Navigation Properties (Recommended) #

This method leverages EF Core's relational mapping to pull in the associated employee data directly when querying service requests.

Step 1: Add a Navigation Property to Your Entity #

First, update your Service_Request_Information class to include a navigation property linking it to the employee record. Make sure the foreign key matches your AssignedTech field:

public class Service_Request_Information
{
    // Your existing properties here...
    public int AssignedTech { get; set; }

    // Add navigation property with foreign key attribute
    [ForeignKey(nameof(AssignedTech))]
    public virtual Employees_Informations Employee_Information { get; set; }
}

Step 2: Modify the Index PageModel to Include Employee Data #

In your IndexModel, modify the query to load the associated employee data using Include():

public class IndexModel : PageModel
{
    private readonly Template.Data.ServiceContext _context;

    public IndexModel(Template.Data.ServiceContext context)
    {
        _context = context;
    }

    public IList<Service_Request_Information> Service_Request_Information { get; set; }

    public async Task OnGetAsync()
    {
        // Include the related employee record with each service request
        Service_Request_Information = await _context.Service_Request_Informations
            .Include(s => s.Employee_Information)
            .ToListAsync();
    }
}

Step 3: Update the Index View to Display the Employee Name #

Replace the code that displays AssignedTech with the employee name from the navigation property:

<!-- Replace this line -->
<td>@Html.DisplayFor(modelItem => item.AssignedTech)</td>

<!-- With this -->
<td>@Html.DisplayFor(modelItem => item.Employee_Information.employeename)</td>

<!-- Or using tag helpers -->
<td><span asp-for="@item.Employee_Information.employeename"></span></td>

Approach 2: Use a ViewModel to Map IDs to Names #

If you don't want to modify your entity class with navigation properties, you can create a ViewModel to encapsulate the display data, mapping employee IDs to names in the PageModel.

Step 1: Create a ViewModel #

Define a ViewModel that includes all the service request properties you need to display, plus the employee name:

public class ServiceRequestViewModel
{
    // Add all your service request properties here (match your entity)
    public int ID { get; set; }
    public string RequestDetails { get; set; } // Example property
    public int AssignedTech { get; set; }
    public string AssignedTechName { get; set; } // The employee name we want to display
}

Step 2: Modify the Index PageModel to Populate the ViewModel #

In your IndexModel, fetch both service requests and employee data, then map them to the ViewModel:

public class IndexModel : PageModel
{
    private readonly Template.Data.ServiceContext _context;

    public IndexModel(Template.Data.ServiceContext context)
    {
        _context = context;
    }

    public IList<ServiceRequestViewModel> ServiceRequests { get; set; }

    public async Task OnGetAsync()
    {
        // Fetch all service requests
        var serviceRequests = await _context.Service_Request_Informations.ToListAsync();
        // Create a dictionary of employee IDs to names for quick lookup
        var employeeNameMap = await _context.Employees_Informations
            .ToDictionaryAsync(e => e.ID, e => e.employeename);

        // Map service requests to the ViewModel
        ServiceRequests = serviceRequests.Select(s => new ServiceRequestViewModel
        {
            ID = s.ID,
            RequestDetails = s.RequestDetails, // Replace with your actual properties
            AssignedTech = s.AssignedTech,
            AssignedTechName = employeeNameMap.TryGetValue(s.AssignedTech, out var name) 
                ? name 
                : "Unknown Employee"
        }).ToList();
    }
}

Step 3: Update the Index View to Use the ViewModel #

Adjust your view to reference the ViewModel properties instead of the entity:

<!-- Update your model declaration at the top of the view -->
@model IList<YourNamespace.ServiceRequestViewModel>

<!-- Then display the employee name -->
<td>@Html.DisplayFor(modelItem => item.AssignedTechName)</td>

Both methods work entirely within Razor Pages without needing separate controllers. The first approach is more efficient and aligns with EF Core's best practices for relational data, while the second is great if you need to avoid modifying your existing entity classes.

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