將變量傳遞到Bootstrap模式

Question

我能夠將變量傳遞給模態底部的bootstrap 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);
    });;
}