Bootstrap將數據傳遞給模式

我已閱讀Bootsrap文檔，甚至測試了他們的「基於觸發器按鈕的不同模態內容」示例，但這不起作用。Bootstrap將數據傳遞給模式

關於如何將數據傳遞給模式以便我不會在頁面中創建多個模態的任何想法。

這裏是觸發模式按鈕：

<a class="btn btn-danger" data-toggle="modal" data-target="#deleteSubject" data-whatever="<?= $subj_id ?>" role="button" title="Delete Subject"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>

這裏是模態：

<div class="modal fade" id="deleteSubject" tabindex="-1" role="dialog" aria-labelledby="deleteSubjectLabel"> 
      <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <form action="#" method="post"> 
        <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title" id="deleteSubjectLabel">Delete Subject</h4> 
        </div> 
        <div class="modal-body"> 
        <h4>Do you want to delete this subject?</h4> 
        <input type="text" id="subjid" name="subjid"> 
        </div> 
        <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> 
        <button type="submit" class="btn btn-danger">Delete</button> 
        </div> 
       </form> 
      </div> 
      </div> 
     </div>

這裏是JavaScript：

<script> 
     $('#deleteSubject').on('show.bs.modal', function (event) { 
      var button = $(event.relatedTarget) 
      var subjId = button.data('whatever') 
      var modal = $(this) 
      modal.find('.modal-body input').val(subjId) 
     }) 
    </script>

我也試過show.bs.modal但沒有任何反應。我試圖創建一個單獨的腳本來測試$subj_id是否通過使用alert來讀取，但它的工作原理。

任何想法？

來源

2016-10-09 aronccs

你需要用的代碼在準備的文件和因爲你的輸入被命名，並有一個ID - 直接針對它然後你不需要找到：

<script> 
    $(document).ready(function(){ 
     $('#deleteSubject').on('show.bs.modal', function (event) { 
      var button = $(event.relatedTarget); 
      var subjId = button.data('whatever'); 
      $('#subjid').val(subjId); 
     }) 
    }) 
</script>

來源

2016-10-09 01:45:10 gavgrif

謝謝，這個作品！ – aronccs

不客氣 - 高興地幫助:) – gavgrif

我覺得你對你的情態實例忘了$，它應該是$modal

<script> 
     $('#deleteSubject').on('show.bs.modal', function (event) { 
      var button = $(event.relatedTarget) 
      var subjId = button.data('whatever') 
      var $modal = $(this) 
      $modal.find('.modal-body input').val(subjId) 
     }) 
    </script>

來源

2016-10-09 01:43:02 XDProgrammer

變量名'$ modal'中的美元符號沒有區別。可能希望在你投降之前將其刪除。 –

我試過了，但沒有任何反應 – aronccs

只需在點擊事件期間使用JavaScript/jQuery設置輸入subjid的值。

$（'＃subjid'）.val（value）;

來源

2016-10-09 01:45:15

Bootstrap將數據傳遞給模式

回答

相關問題