1. 程式人生 > >bootstrap 模態框動態載入資料

bootstrap 模態框動態載入資料

1.頁面中新增modal

<!-- 模態框(Modal) -->
<div class="modal fade" id="showModal" tabindex="-1" role="dialog" 
   aria-labelledby="myModalLabel" aria-hidden="true">
   <div class="modal-dialog" style="width:900px;">
      <div class="modal-content">

//內容動態填充
      </div><!-- /.modal-content -->
</div><!-- /.modal -->
</div>

2.資料格式。頁面動態生成a 標籤

<a data-toggle='modal'   data-target='#showModal' onclick=targetto('"  + row.id + "')>"+ row.title+"</a>";

3.單擊事件

 function targetto(id){

             $("#showModal").modal({
                remote: "showAction.action?id="+id
            });

             }

4.每次隱藏時,清除資料。確保點選時,重新載入

    $("#showModal").on("hidden.bs.modal", function() {
       $(this).removeData("bs.modal");

   });

5.基於bootstrap3.其他版本,請自己Google,如有雷同,純屬巧合,如有需要,歡迎分享。