CSHTML页面@if条件为真时内部元素仍不显示的问题

核心问题：AJAX调用未处理返回的视图内容 #

你的AJAX请求仅发送了请求，但未接收控制器返回的HTML并更新页面，因此即使控制器正确生成了包含下拉列表的视图，前端也不会显示。此外代码中还有几处错误需要修正：

步骤1：修复控制器代码中的对象复用问题 #

循环中反复使用同一个objFileNames实例，会导致列表里所有元素都是最后一个文件的信息，需每次循环新建实例：

public ActionResult LoadFiles(string filePath, FeatureDisplayListModel getFileName)
{
    ModelState.Clear();
    string errorMessage = "";

    try
    {
        string[] fileEntries = Directory.GetFileSystemEntries(filePath);
        // 提前初始化列表，避免循环内重复判断
        if (getFileName.getFileNamesList == null)
        {
            getFileName.getFileNamesList = new List<GetFilesModel>();
        }

        foreach (string fileName in fileEntries)
        {
            // 每次循环新建GetFilesModel实例
            GetFilesModel objFileNames = new GetFilesModel();
            string trimFileName = Path.GetFileName(fileName);
            objFileNames.getFileNames = trimFileName;
            objFileNames.getFilepath = fileName;

            getFileName.getFileNamesList.Add(objFileNames);
        }

        getFileName.isFileName = true;
    }
    catch (Exception ex)
    {
        errorMessage = "NO TAG FOUND";
        getFileName.errorMessage = errorMessage; // 建议给Model添加错误属性
        // 返回局部视图而非完整视图，AJAX仅需更新局部内容
        return PartialView("_FileDropdown", getFileName);
    }

    // 返回局部视图，而非完整的ConfigChecker视图
    return PartialView("_FileDropdown", getFileName);
}

步骤2：创建局部视图存放下拉列表 #

把原CSHTML里的下拉列表部分抽成局部视图（命名为_FileDropdown.cshtml），让控制器仅返回这部分HTML：

@model FeatureDisplayListModel

@if (Model != null && Model.getFileNamesList != null && Model.getFileNamesList.Any())
{
    <table cellpadding="8">
        <tr>
            <th>File Names</th>
            <td>
                <!-- 修正DropDownListFor绑定：第一个参数是选中项的属性，而非列表本身 -->
                @Html.DropDownListFor(m => m.SelectedFilePath, 
                    new SelectList(Model.getFileNamesList, "getFilepath", "getFileNames"), 
                    " -- Select File --", 
                    new { style = "width: 200px;" })
            </td>
        </tr>
    </table>
}

@if (!string.IsNullOrEmpty(Model?.errorMessage))
{
    <p style="color:red;">@Model.errorMessage</p>
}

注意：需在FeatureDisplayListModel中添加SelectedFilePath字符串属性，用来存储下拉列表的选中值，这是之前的核心绑定错误。

步骤3：修改主视图的AJAX逻辑，处理返回的HTML #

主视图中添加容器存放下拉列表，并在AJAX成功后更新该容器：

<div>
    <table cellpadding="8">
        <tr>
            <th>File Path</th>
            <td>@Html.TextBoxFor(Model => Model.returnFilename, new { id = "filepath" })</td>
        </tr>
    </table>

    <!-- 添加容器渲染下拉列表局部视图 -->
    <div id="fileDropdownContainer">
        <!-- 初始加载时若有数据，也可渲染 -->
        @Html.Partial("_FileDropdown", Model)
    </div>
</div>

<script type="text/javascript">
    $(function () {
        console.log("in script");
        $("#filepath").on('change', function () {
            var filePath = $(this).val();
            $.ajax({
                type: 'POST',
                // 无需指定dataType: 'JSON'，返回的是HTML
                url: '/Home/LoadFiles',
                data: { filePath: filePath },
                success: function (response) {
                    // 用返回的局部视图HTML更新容器
                    $("#fileDropdownContainer").html(response);
                },
                error: function () {
                    $("#fileDropdownContainer").html("<p style='color:red;'>加载文件列表失败</p>");
                }
            });
        });
    })
</script>

步骤4：完善Model定义 #

确保FeatureDisplayListModel包含必要属性：

public class FeatureDisplayListModel
{
    public string returnFilename { get; set; }
    public List<GetFilesModel> getFileNamesList { get; set; }
    public bool isFileName { get; set; }
    public string SelectedFilePath { get; set; } // 新增：存储下拉列表选中路径
    public string errorMessage { get; set; } // 新增：存储错误信息
}

public class GetFilesModel
{
    public string getFileNames { get; set; }
    public string getFilepath { get; set; }
}

关键错误点总结 #

1. AJAX未处理返回结果：原AJAX仅发送请求，未将返回的视图内容更新到页面，导致下拉列表不显示。
2. DropDownListFor绑定错误：第一个参数应为选中值的属性，而非列表本身，否则无法正确生成下拉列表。
3. 控制器对象复用：循环中复用同一个GetFilesModel实例，导致列表数据错误。
4. 返回完整视图而非局部视图：AJAX请求无需返回整个页面，仅返回下拉列表的局部HTML即可，提升性能并避免页面结构冲突。

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