bootstrap modal重新創建而不重新加載

頁面加載時會生成模態窗口的內容。我可以通過JS重新生成此模式窗口的內容而無需重新加載頁面嗎？bootstrap modal重新創建而不重新加載

我的模態窗口：

<div class="modal-team-NtSubstitutePlayers modal fade" tabindex="-1" role="dialog"> 
      <div class="modal-dialog modal-lg" role="document"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
        </div> 
        <div class="modal-body"> 
         <div class="list-of-players text-center"> 
          <div class="list"> 
           @foreach($team->players as $player) 
            @if ($player->ntsubstitute && !$player->ntskipnextmatch) 
             <a class="player_choose" id="player_id_substitute_{{$player->id}}"> 
              <div class="player"> 
               .... 
              </div> 
             </a> 
            @endif 
           @endforeach 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div>

來源

2017-09-23 Igor Ostapiuk

你使用引導情態動詞？添加模態的HTML代碼 – Thusitha

是的。已經添加。 –

我的意思是像$（'＃modal-team-NtSubstitutePlayers'）.reload（）或$（'＃modal-team-NtSubstitutePlayers'）重新創建（） –

HTML 添加ID的模式。

<div id="myModal" class="modal-team-NtSubstitutePlayers modal fade" tabindex="-1" role="dialog"> 
      <div class="modal-dialog modal-lg" role="document"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
        </div> 
        <div class="modal-body"> 
         <div class="list-of-players text-center"> 
          <div class="list"> 
           @foreach($team->players as $player) 
            @if ($player->ntsubstitute && !$player->ntskipnextmatch) 
             <a class="player_choose" id="player_id_substitute_{{$player->id}}"> 
              <div class="player"> 
               .... 
              </div> 
             </a> 
            @endif 
           @endforeach 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div>

的JavaScript

//Show the modal 
$("#myModal").modal("show"); 

//Reload the modal content 
var modalHtml = $("#myModal").html(); 
$("#myModal").html(""); 
$("#myModal").html(modalHtml); 

//Hide the modal 
$("#myModal").modal("hide");

來源

2017-09-23 15:08:34 Thusitha

但我不想顯示或隱藏模式窗口。我想重新加載模態窗口的內容，無需重新加載頁面。 –

在這種情況下，您應該從JavaScript代碼動態添加HTML代碼。我看到您從服務器呈現最初的HTML代碼。 – Thusitha

@IgorOstapiuk我更新了答案。看一看。 – Thusitha

bootstrap modal重新創建而不重新加載

回答

相關問題