javascript - Populating Bootstrap 3 Modal on Button Click -

i junior web developer , creating dynamic website. within website using javascript in order structure pages e.g. entering html var string , calling upon load on page when necessary.

i trying use bootstrap modal various forms input data database. giving me trouble elements such datepicker not working assume because modal loads on click of button date picker loads on page load.

anyway, wanted know if there way have content , custom javascript load when bootstrap modal button clicked e.g.

        var outputcontainer1 = $('#selectcraft'); $.ajax(apiprefix + '/craft' + apisuffix, {     error: function() {},     success: function(data){         for(var in data){             $('#selectcraft').append('<option value="'+ data[i].id +'">'+data[i].aircraft_name+'</option>');         }     },     type: 'get' }); 

as can see select element getting information database. want load on button click rather @ page-load.

my data target button "#flightmodal" , modal id "#flightmodal".

if can appreciate.

thanks

ibrahim

you need initialize datepicker after modal created. build dom in success callback, initiaze datepicker on normal page load:

success: function () {     // ...     $('#datepicker').datetimepicker(); } 

by way, if working modals, recommend using bootstrap dialog javascript library, makes working models programmatically easier. example can show simple modal window this:

bootstrapdialog.show({     title: 'hello world',     message: 'this hello world message' });