MVC视图展示带搜索功能的用户列表时页面空白问题求助

核心问题1：搜索接口空值未处理 #

页面首次加载无搜索关键词时，searchText参数为null，直接传入Contains()方法会触发空引用异常，导致分部视图渲染失败，页面空白。

核心问题2：返回值类型不匹配 #

SearchUsers方法中LINQ查询返回的是IEnumerable<UserListModel>类型，但分部视图声明接收的是List<UserListModel>，类型不匹配会导致视图绑定失败。

核心问题3：字符串空值未兼容 #

用户表中FirstName/LastName/Username字段如果存在null值，调用ToLower()时也会触发空引用异常。

核心问题4：主视图初始渲染缺失 #

如果Index.cshtml主视图中没有初始加载分部视图的代码，首次打开页面时表格区域会直接空白。

核心问题5：分部视图标签缺失 #

你提供的分部视图代码没有闭合tbody和table标签，会导致HTML渲染异常。

1. 修正AdminUserController的SearchUsers方法 #

public PartialViewResult SearchUsers(string searchText)
{
    List<UserListModel> model = MemberList();
    // 搜索词为空直接返回全量数据
    if (string.IsNullOrWhiteSpace(searchText))
    {
        return PartialView("_MemberListTable", model);
    }
    string lowerSearch = searchText.ToLower();
    var searchResult = model.Where(a => 
        (a.FirstName?.ToLower().Contains(lowerSearch) ?? false) || 
        (a.LastName?.ToLower().Contains(lowerSearch) ?? false) ||
        (a.Username?.ToLower().Contains(lowerSearch) ?? false))
        .ToList(); // 转List匹配视图要求类型

    return PartialView("_MemberListTable", searchResult);
}

2. 确认Index.cshtml主视图代码 #

确保主视图中存在初始加载分部视图和Ajax绑定的逻辑，示例如下：

@model List<GymWiz.Models.UserListModel>
<!-- 搜索框区域 -->
<div class="search-box">
    <input type="text" id="searchInput" placeholder="输入关键词搜索用户" />
</div>
<!-- 初始渲染分部视图 -->
<div id="tableContainer">
    @Html.Partial("_MemberListTable", Model)
</div>
<!-- AJAX搜索绑定逻辑 -->
<script>
$('#searchInput').on('input', function() {
    $.get('@Url.Action("SearchUsers", "AdminUser")', {searchText: $(this).val()}, function(res) {
        $('#tableContainer').html(res);
    })
})
</script>

3. 补全分部视图代码 #

@model List<GymWiz.Models.UserListModel>
<table class="table user-list" id="memberListTable">
    <thead>
        <tr>
            <th><b>Name</b></th>
            <th><b>Joined Date</b></th>
            <th><b>Card ID</b></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var user in Model)
        {
            <tr>
                <td>@user.FirstName @user.LastName</td>
                <td>@user.CreatedDate?.ToString("yyyy-MM-dd")</td>
                <td>@user.MembershipCardId</td>
                <td><!-- 操作按钮代码按需补充 --></td>
            </tr>
        }
    </tbody>
</table>

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