ASP.NET引导模式显示

问题描述 投票:0回答:1

以表格的形式表示。如果单击表中的行名称,将显示模式窗口。模态窗口的形式非常复杂。

要显示模态窗口,我使用以下代码:

$('#modal-container').on('shown.bs.modal', function (event) {
    var button = $(event.relatedTarget); // Button that triggered the modal
    var url = button.attr("href");
    var modal = $(this);
    modal.find('.modal-content').load(url);
});    
$.ajaxSetup({ cache: false });
$('#modal-container').on('hidden.bs.modal', function () {
    $(this).removeData('modal');
});

有以下问题:

  1. 当重复呼叫很短的时间时,显示最后一个呼叫的内容 - 它不是那么重要
  2. 有时新内容根本不会显示,模态窗口包含上次调用的信息 - 这非常重要

请告诉我,可能是什么问题。我对JS不太了解

下载内容的代码:

<div id="modal-container" class="modal fade hidden-print" @*tabindex="-1" *@ role="dialog" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog">
    <div class="modal-content">

    </div>
</div>

从动作方法调用

return PartialView("Details", projectECVM);

我怀疑js跑得比剃刀生成页面的速度快。

在这里,我正在形成一个动作方法的调用:

@foreach (var item in Model.ProjectVM)
    {
        <tr class="clickableProject" id="@item.Id" title="View BugReports for @item.ProjectName">
            <td id="Name">
                <a id="details-link" asp-action="Details" asp-controller="Project" asp-route-id="@item.Id" title="View details project @item.ProjectName" data-toggle="modal" data-target="#modal-container">@Html.DisplayFor(it => item.ProjectName)</a>
            </td>
            <td id="Owner">
                <label class="clickableProject">@item.Owner</label>
            </td>
            <td id="TrelloBoardURL">
                <a id="trelloboard-link" href="@item.TrelloBoardURL" title="Go to TrelloBoard" target="_blank"><img src="~/images/trello-logo-blue.png" height="20" /></a>
            </td>
            <td id="Modification">
                <label class="clickableProject">@item.Modification</label>
            </td>
            <td id="By">
                <label class="clickableProject">@item.By</label>
            </td>
            <td id="DateTime">
                <label class="clickableProject">@item.EntryDateTime</label>
            </td>
        </tr>
    }
asp.net asynchronous bootstrap-modal
1个回答
0
投票

在加载新内容之前清除对话框的内容:

$(document).ready(function () {
   $(function () {
     $('#modal-container').on('shown.bs.modal', function (event) {
         var button = $(event.relatedTarget); // Button that triggered the modal
         var url = button.attr("href");
         var modal = $(this);
         $(this).empty(); //adding this part before reloading it.
        modal.find('.modal-content').load(url);
     });    
     $.ajaxSetup({ cache: false });
     $('#modal-container').on('hidden.bs.modal', function () {
     //$(this).empty(); //moved from shown
     $(this).removeData('modal');
 });
           if ($('#modal-container').text().trim().length > 0) {
                $('#modal-container').dialog('open');
            }
            else {
            }
        });
    });
© www.soinside.com 2019 - 2024. All rights reserved.