將變量傳遞到Bootstrap模式

Question

我能夠將變量傳遞到模式底部的引導程序3模式，它表示id =「callId」，但是如何將callID傳遞給模式，其中我有$ test = callId。

<a data-id="<?=$sid?>" data-conf="<?=$call_conf?>" class="open-AddCallDialog btn btn-success btn-xs" href="#addCallDialog">Call Borrower</a> 

jQuery的腳本

$(document).on("click", ".open-AddCallDialog", function (e) { 

    e.preventDefault(); 

    var _self = $(this); 

    var myCallId = _self.data('id'); 
    $("#callId").val(myCallId); 

    $(_self.attr('href')).modal('show'); 
}); 

模態

<div class="modal fade" id="addCallDialog"> tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title" id="myModalLabel">Call Borrower</h4> 
     </div> 
     <div class="modal-body"> 
     <div class="row well"> 
     $test = call_conf; 



     </div> 
     </div> 
     <div class="modal-footer"> 
     <input name="id" id="callId" type="hidden" value=""/> 
     <input name="pid" type="hidden" value="<?php echo $pid;?>"/> 
     <input name="processtp" type="hidden" value="callborrower"/> 
     <button id="submit" class="btn btn-primary btn-block btn-xs center">Update</button> 
     </div> 
     </form> 
     </div> 

    </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 

Answer 1

有創建引導模態時被解僱/摧毀了一些事件。

您需要的是shown.bs.modal，一旦顯示模式並且所有的CSS3動畫都完成，就會觸發該模式。通過掛鉤這個事件，你可以添加數據到模式的DOM結構。

$(document).on('click', '.openAddCallDialog', function(event) 
{ 
    var _self = $(this), 
     id = _self.data('id'), 
     conf = _self.data('conf'), 
     modalEl = $(_self.attr('href')); 

    modalEl.modal('show').one('shown.bs.modal', function(event) 
    {    
     // This function body is the modal shown event callback 
     // You can do anything in this function to modify the DOM 
     // within the shown modal. 

     var modal = $(this); 

     modal.find('#callId').val(callId); 

     modal.find('.well').text(conf); 
    });; 
}