ASP.NET Core中Bootstrap模态框重复点击加载数据失效问题求助

数据老陈

2026-5-6

问题分析与解决方案

看起来你遇到的核心问题是：首次点击锚点能正确加载对应Cabinet的文件夹，但后续点击其他Cabinet的按钮时，后端的存储过程没有被执行，导致内容不更新。这是因为你的前端脚本和锚点的跳转逻辑存在冲突，且没有正确传递参数到后端。

问题根源拆解

锚点默认行为与脚本逻辑冲突：你的锚点元素通过asp-controller/asp-action生成了带参数的GetCabinetContents接口URL，但脚本里直接调用了不带参数的_CabinetFoldersPartial视图，没有利用锚点生成的参数。首次点击可能是浏览器触发了锚点的默认跳转，刚好执行了正确的接口，但后续点击模态框已存在，默认跳转被阻断，脚本加载的无参数视图无法触发存储过程。
参数传递缺失：脚本中没有提取当前点击Cabinet的BranchID和CabinetID，导致后端无法筛选对应数据。

修正方案

1. 修正前端脚本，正确传递参数

修改你的点击事件脚本，阻止锚点默认跳转，并获取锚点生成的完整接口URL（包含参数）来加载内容：

@section LoadCabinetFolders {
    <script>
        $(function () {
            $('body').on('click', '.cabinet_contents_btn', function (e) {
                // 阻止锚点的默认跳转行为，避免页面刷新
                e.preventDefault();
                
                // 获取当前锚点生成的带参数的接口URL
                const targetUrl = $(this).attr('href');
                
                // 清空容器并加载对应内容，可添加加载提示提升体验
                $('#loadCabinetFolders').html('<div class="text-center"><i class="fas fa-spinner fa-spin"></i> 加载中...</div>');
                $('#loadCabinetFolders').load(targetUrl);
            });
        });
    </script>
}

2. 修正后端Action的参数使用（可选但关键）

注意到你调用GetFolders时第一个参数写死为1，这应该是笔误，需要替换为传入的BranchID，确保数据筛选正确：

public IActionResult GetCabinetContents(int BranchID, int CabinetID)
{
    // 替换固定值1为传入的BranchID，保证分支筛选正确
    return PartialView("_CabinetFoldersPartial", this.cabinet.GetFolders(BranchID, CabinetID));
}

3. 验证Partial视图的模型接收

确保_CabinetFoldersPartial视图正确接收文件夹模型并渲染，例如：

@model IEnumerable<YourFolderModel>

@if (Model.Any())
{
    <ul class="list-group">
        @foreach (var folder in Model)
        {
            <li class="list-group-item">@folder.FolderName</li>
        }
    </ul>
}
else
{
    <p class="text-muted">该Cabinet暂无文件夹</p>
}

为什么之前首次点击有效？

首次点击时，浏览器优先触发了锚点的默认跳转，调用了带正确参数的GetCabinetContents接口，返回了对应数据并显示在模态框中。但后续点击时，模态框已存在于DOM中，默认跳转被事件逻辑阻断，脚本加载的无参数视图无法触发后端的存储过程，导致内容不更新。

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