Dynamically load information to Twitter Bootstrap modal

Question

Problem:

I would like to transfer by using jQuery a value in an link-attribute to PHP/SQL query.

HTML code:

Answer 1

Final solution

HTML code:

<div id="myModal" class="modal hide fade">
    <div class="modal-header">
      <button class="close" data-dismiss="modal">&times;</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);
        }
    });
});

Answer 2

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/

Answer 3

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);
           }
    });


});

   });