Send data from DB to bootstrap modal's

I want to ask what is the best way to send data to a modal-body. Lets say i have a link like :

Code:

<a href="#" data-toggle="modal" data-target=".bs-example-modal">Test </a>

and then the bootstrap modal :

Code:

<div class="modal fade bs-example-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
          <div class="modal-content">
               <div class="modal-header">
                    <button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
                    <h4 id="myLargeModalLabel" class="modal-title">Test</h4>
               </div>
                                           
               <div class="modal-body">
                    
                     contect here !!

               </div>
                                           
               <div class="modal-footer">
                     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
               </div>
           </div>
     </div>
   

Now adding then with different ID's its very bad since this will create a loot of modal's and that is just bad codding...
I have read a loot of variables on how to get the data by aJax but still not that sure on how to do it.
If anyone was some time for a explanation fell free to post.


Thanks for your time.

Website : www.my-web-projects.com