Dynamically load information to Twitter Bootstrap modal

here is the solution ,

<a href="#" id="1" class="push">click</a> 

use a div on your modal body , like this

    <div class="modal-body">               <div class="something" style="display:none;">                    // here you can show your output dynamically              </div>    </div>

now put data into the .something with ajax calling .please check http://api.jquery.com/jQuery.ajax/ to know more about jquery ajax.

   $(function(){   $('.push').click(function(){      var essay_id = $(this).attr('id');       $.ajax({          type : 'post',           url : 'your_url.php', // in here you should put your query           data :  'post_id='+ essay_id, // here you pass your id via ajax .                     // in php you should use $_POST['post_id'] to get this value        success : function(r)           {              // now you can show output in your modal               $('#mymodal').show();  // put your modal id              $('.something').show().html(r);           }    });});   });

Final solution

HTML code:

<div id="myModal" class="modal hide fade">    <div class="modal-header">      <button class="close" data-dismiss="modal">×</button>      <h3>Title</h3>    </div>    <div class="modal-body">                    <div id="modalContent" style="display:none;">        </div>    </div>    <div class="modal-footer">      <a href="#" class="btn btn-info" data-dismiss="modal" >Close</a>    </div></div>  

jQuery code:

$("a[data-toggle=modal]").click(function() {       var essay_id = $(this).attr('id');    $.ajax({        cache: false,        type: 'POST',        url: 'backend.php',        data: 'EID='+essay_id,        success: function(data)         {            $('#myModal').show();            $('#modalContent').show().html(data);        }    });});

1. Get ID with jQuery
2. Pass it to some script via AJAX
3. Get your results back and do with them what you please

http://api.jquery.com/jQuery.ajax/