jquery - Bootstrap Modal not working via javascript -


i calling bootstrap modal via jquery inside of function error message follows:

$('#validatebutton').click(function() {      var registrationlocation = $('#url').val();      if (registrationlocation.indexof("http") ==0) {         // todo - hardcoded dataflow - must fixed!         var hc06dfurn = "urn:sdmx:org.sdmx.infomodel.datastructure.dataflow=estat:hc06(1.0)";         $.getjson("/" + webappname + "/ws/rest/registerservice?url=" + registrationlocation + "&dataflowurn="+hc06dfurn, registerfilesuccess).error(displayerrordialog);     } else {         $.getjson("/" + webappname + "/ws/rest/registerfile?url=" + registrationlocation, registerfilesuccess).error(displayerrordialog);     }     $('#errordialog').modal('show') }); 

heres html modal:

<div id="errordialog" class="modal hide fade">         <div class="modal-header">             <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>             <h3 id="mymodallabel">modal header</h3>         </div>             <div class="modal-body">             <p>one fine body…</p>         </div>         <div class="modal-footer">             <button class="btn" data-dismiss="modal" aria-hidden="true">close</button>             <button class="btn btn-primary">save changes</button>         </div>   </div> 

i seeing fade effect no modal appearing when inspect html on page modal seems empty:

<div class="modal-backdrop fade in">     <div></div> </div> 

any ideas?

you need create div modal body placed (container):

<div class="modal-backdrop fade in" id="mymodal">     <div id="mymodalcontainer"></div> </div> 

then on button click pass modal body container div:

$('#validatebutton').click(function () {     var url = "/somemodal/url";     $.get(url, function (data) {         $('#mymodalcontainer').html(data);         $('#mymodal').modal('show');     }); }); 

Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -