javascript - Bootstrap modal with content cant be opened twice -


just starting out please bear me :)

i have searched on site answers not find 1 matched problem.

i'm trying open bootstrap modal , content using jquery ajax form plugin. works , content showed in modal, however, when close modal , open again, screen flickers , gets grey (backdrop opens) , goes back.

if reload site , try again, works until try open same modal again. if skip loading content modal opens / closes fine many times want. think has old content being there when opening again. content changes need wipe old ones modal div, cant seem work.

standard modal div:

<link rel="stylesheet" href="css/bootstrap-custom.css"> <link rel="stylesheet" href="css/bootstrap-theme.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="http://malsup.github.com/jquery.form.js"></script>  <div class="modal fade" id="mymodal" role="dialog"> <div class="modal-dialog">    <div class="modal-content">     <div class="modal-header">       <button type="button" class="btn btn-default" data-dismiss="modal">lukk</button>     </div>     <div class="modal-body">         <div class="something" style="display:none;">         </div>               </div>   </div> </div> 

button used open modal:

<button type="button" class="btn btn-primary push" id="1" data-toggle="modal" data-target="#mymodal">button</button> 

and finally, script fill modal content:

$(document).ready(function(){    $('.push').click(function(){       var id = $(this).attr('id');       $.ajax({          type : 'post',          url : 'target.php',           data :  {'id': id},            success : function(r)         {                //show modal           $('#mymodal').modal('show')            $('.something').show().html(r); //show content in modal div                     } //success push     });//.ajax  }); //push     //trying close modal , delete content    $("#mymodal").on('hidden.bs.modal', function () {       $('#mymodal').removedata('bs.modal')       $(this).data('bs.modal', null);     }); //mymodal hidden  });//document ready 

as mentioned, works once. upon closing modal , opening again fails.

i think figured out after several(!) hours , turns out rookie mistake. posting here in case else has same problem.

turns out html ajax-post returns contained script-sources:

<link rel="stylesheet" href="css/bootstrap-custom.css"> <link rel="stylesheet" href="css/bootstrap-theme.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="http://malsup.github.com/jquery.form.js"></script> 

so causing problems. when deleting these "target.php" seems work fine :)


Comments

Popular posts from this blog

c# - Validate object ID from GET to POST -

node.js - Custom Model Validator SailsJS -

php - Find a regex to take part of Email -