如何将下拉列表(DDL)参数值传递至筛选查询

核心问题分析 #

你的代码主要存在三个关键问题：

• 下拉框的name属性与后台OnPost方法的参数名不匹配，导致模型绑定失败
• DateComplete字段的空值判断逻辑错误，用ToString() == ""会引发不准确的结果
• 多余且逻辑错误的JavaScript代码，表单提交会自动携带下拉框值，无需额外处理

修正后的完整代码 #

1. 后台.cs文件修改

[BindProperties]
public class IndexModel : PageModel
{
    private readonly ApplicationDbContext _db;

    public IndexModel(ApplicationDbContext db)
    {
        _db = db;
    }

    public IEnumerable<Officer> DisplayProbOfficerData { get; set; }
    public IEnumerable<InvestigationLog> Results { get; set; }

    public async Task OnGetAsync()
    {
        // 移除无意义的冗余查询，直接排序加载官员列表
        DisplayProbOfficerData = await _db.Officer.OrderBy(x => x.DisplayName).ToListAsync();
        // 初始加载默认显示所有未完成（DateComplete为空）的记录
        Results = await _db.InvestigationLog.Where(x => x.DateComplete == null).ToListAsync();
    }

    // 修改参数名为SelectOfficer，与下拉框name属性匹配
    public async Task OnPostAsync(string SelectOfficer)
    {
        // 回传页面时重新加载官员列表，避免下拉框数据丢失
        DisplayProbOfficerData = await _db.Officer.OrderBy(x => x.DisplayName).ToListAsync();
        
        // 修正空值判断逻辑：直接判断可空日期是否为null
        Results = await _db.InvestigationLog
            .Where(x => x.ProbOfficer == SelectOfficer && x.DateComplete == null)
            .ToListAsync();

        ViewData["officerparameter"] = $"For Officer: {SelectOfficer}";
    }
}

2. 前端.cshtml文件修改

<form asp-page="./Index" method="post">
    <div class="form-actions no-color">
        <p>
            <h5>Probation Officer Selection</h5>
            <br/>
            <!-- 下拉框name保持为SelectOfficer，与后台参数名一致 -->
            <select name="SelectOfficer" id="Select1" class="form-select" 
                    asp-items="@(new SelectList(Model.DisplayProbOfficerData, "DisplayName", "DisplayName"))">
                <option value="" selected disabled>---Select Probation Officer---</option>
            </select>
            <br/>
            <input type="submit" value="Filter Report" class="btn btn-primary mx-2" />
            <a asp-page="./Index" class="btn btn-link mx-2">Return to Full List</a>
        </p>
    </div>
</form>
<!-- 移除无用的JavaScript代码 -->

关键修改说明 #

1. 参数名称匹配：ASP.NET Core模型绑定默认按表单字段的name属性匹配后台参数名，将OnPost的参数从officer改为SelectOfficer，与下拉框name一致，即可自动传递选中值。
2. 空值判断优化：如果DateComplete是DateTime?（可空日期类型），直接判断x.DateComplete == null比ToString() == ""更准确，避免默认日期格式导致的判断错误。
3. 性能与体验优化：移除冗余的数据库查询，OnPost中重新加载官员列表防止页面回传后下拉框无数据，初始加载默认显示未完成记录更符合需求。
4. 移除无效JS：表单提交会自动携带下拉框选中值，原JavaScript逻辑混乱且无意义，直接删除即可。

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