ASP.NET 부트 스트랩 모달 표시

Question

테이블 형태로 표현되어 있습니다. 표에서 행 이름을 클릭하면 모달 창이 표시됩니다. 꽤 복잡한 형태의 모달 창.

내가 다음 코드를 사용하여 모달 창을 표시하려면 :

$('#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 빨리 면도칼에 비해 실행 의심

return PartialView("Details", projectECVM); 

액션 메소드에서

<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> 

전화 : 나는 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> 
    } 

Answer 1

지우기 새로운 콘텐츠 넣기 전에 대화 상자의 내용 :이 경우

$(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 { 
      } 
     }); 
    });