ASP.NET Core MVC多字段搜索功能实现求助（附代码）

一、控制器层改造 #

1. 定义搜索参数模型 #

新建一个专门的视图模型类，用来接收用户的搜索输入，避免直接复用实体类：

public class PropertySearchViewModel
{
    // 用可空类型，用户没填对应字段时就不触发过滤
    public decimal? MinPrice { get; set; }
    public decimal? MaxPrice { get; set; }
    public decimal? MinArea { get; set; }
    public decimal? MaxArea { get; set; }
    public string AreaUnit { get; set; }
}

2. 修改Index Action逻辑 #

用EF Core操作数据库的情况

假设你的实体类是Property，数据上下文实例是_dbContext，修改Action如下：

public IActionResult Index(PropertySearchViewModel searchModel)
{
    // 初始化查询对象，先拿到全量数据的查询入口
    var query = _dbContext.Properties.AsQueryable();

    // 价格过滤：用户填了最低/最高价格就添加对应筛选条件
    if (searchModel.MinPrice.HasValue)
    {
        query = query.Where(p => p.Price >= searchModel.MinPrice.Value);
    }
    if (searchModel.MaxPrice.HasValue)
    {
        query = query.Where(p => p.Price <= searchModel.MaxPrice.Value);
    }

    // 面积过滤
    if (searchModel.MinArea.HasValue)
    {
        query = query.Where(p => p.Area >= searchModel.MinArea.Value);
    }
    if (searchModel.MaxArea.HasValue)
    {
        query = query.Where(p => p.Area <= searchModel.MaxArea.Value);
    }

    // 面积单位过滤：用户选中了具体单位才筛选
    if (!string.IsNullOrEmpty(searchModel.AreaUnit))
    {
        query = query.Where(p => p.AreaUnit == searchModel.AreaUnit);
    }

    // 执行查询，拿到最终结果列表
    var properties = query.ToList();

    // 把用户输入的搜索参数传回视图，保留输入状态
    ViewBag.SearchModel = searchModel;
    return View(properties);
}

用原始SQL查询的情况

如果是直接写SQL语句，替换成以下逻辑：

public IActionResult Index(PropertySearchViewModel searchModel)
{
    var sql = "SELECT * FROM Properties WHERE 1=1";
    var parameters = new List<SqlParameter>();

    if (searchModel.MinPrice.HasValue)
    {
        sql += " AND Price >= @MinPrice";
        parameters.Add(new SqlParameter("@MinPrice", searchModel.MinPrice.Value));
    }
    if (searchModel.MaxPrice.HasValue)
    {
        sql += " AND Price <= @MaxPrice";
        parameters.Add(new SqlParameter("@MaxPrice", searchModel.MaxPrice.Value));
    }
    if (searchModel.MinArea.HasValue)
    {
        sql += " AND Area >= @MinArea";
        parameters.Add(new SqlParameter("@MinArea", searchModel.MinArea.Value));
    }
    if (searchModel.MaxArea.HasValue)
    {
        sql += " AND Area <= @MaxArea";
        parameters.Add(new SqlParameter("@MaxArea", searchModel.MaxArea.Value));
    }
    if (!string.IsNullOrEmpty(searchModel.AreaUnit))
    {
        sql += " AND AreaUnit = @AreaUnit";
        parameters.Add(new SqlParameter("@AreaUnit", searchModel.AreaUnit));
    }

    var properties = _dbContext.Properties.FromSqlRaw(sql, parameters.ToArray()).ToList();
    ViewBag.SearchModel = searchModel;
    return View(properties);
}

二、视图层改造 #

1. 搜索表单部分 #

在视图顶部添加搜索表单，用get方法方便用户保存或分享搜索链接：

<!-- 搜索表单 -->
<form asp-action="Index" method="get">
    <div class="row g-3">
        <div class="col-md-2">
            <label class="form-label">最低价格</label>
            <input type="number" step="0.01" 
                   asp-for="@((PropertySearchViewModel)ViewBag.SearchModel).MinPrice" 
                   class="form-control" />
        </div>
        <div class="col-md-2">
            <label class="form-label">最高价格</label>
            <input type="number" step="0.01" 
                   asp-for="@((PropertySearchViewModel)ViewBag.SearchModel).MaxPrice" 
                   class="form-control" />
        </div>
        <div class="col-md-2">
            <label class="form-label">最小面积</label>
            <input type="number" step="0.01" 
                   asp-for="@((PropertySearchViewModel)ViewBag.SearchModel).MinArea" 
                   class="form-control" />
        </div>
        <div class="col-md-2">
            <label class="form-label">最大面积</label>
            <input type="number" step="0.01" 
                   asp-for="@((PropertySearchViewModel)ViewBag.SearchModel).MaxArea" 
                   class="form-control" />
        </div>
        <div class="col-md-2">
            <label class="form-label">面积单位</label>
            <select asp-for="@((PropertySearchViewModel)ViewBag.SearchModel).AreaUnit" class="form-select">
                <option value="">全部</option>
                <option value="㎡">平方米</option>
                <option value="sqft">平方英尺</option>
                <!-- 根据你的数据库数据添加其他单位选项 -->
            </select>
        </div>
        <div class="col-md-2 align-self-end">
            <button type="submit" class="btn btn-primary w-100">搜索</button>
            <a asp-action="Index" class="btn btn-secondary w-100 mt-2">重置</a>
        </div>
    </div>
</form>

2. 结果展示卡片 #

保留你原来的foreach循环，展示搜索后的结果：

<!-- 搜索结果卡片区域 -->
<div class="row mt-4">
    @foreach (var property in Model)
    {
        <div class="col-md-4 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="card-title">@property.Title</h5>
                    <p class="card-text text-primary">价格: @property.Price 元</p>
                    <p class="card-text">面积: @property.Area @property.AreaUnit</p>
                    <!-- 根据需要添加其他字段展示 -->
                </div>
            </div>
        </div>
    }
</div>

三、优化建议（可选） #

如果想让视图更规范，建议使用强类型视图模型替代ViewBag：

1. 新建一个整合搜索参数和结果的模型：

public class PropertyIndexViewModel
{
    public PropertySearchViewModel SearchModel { get; set; } = new PropertySearchViewModel();
    public List<Property> Properties { get; set; } = new List<Property>();
}

2. 修改控制器返回逻辑：

public IActionResult Index(PropertySearchViewModel searchModel)
{
    // 前面的查询逻辑保持不变
    var vm = new PropertyIndexViewModel
    {
        SearchModel = searchModel,
        Properties = properties
    };
    return View(vm);
}

3. 视图顶部声明强类型：

@model YourNamespace.Models.PropertyIndexViewModel

4. 简化表单和遍历代码：

<!-- 表单部分 -->
<form asp-action="Index" method="get">
    <input type="number" step="0.01" asp-for="SearchModel.MinPrice" class="form-control" />
    <!-- 其他字段同理，直接用Model.SearchModel.XXX绑定 -->
</form>

<!-- 遍历部分 -->
@foreach (var property in Model.Properties)
{
    <!-- 卡片代码保持不变 -->
}

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