Codechef4u is a community for computer professionals,by computer professionals,just like you; who loves sharing and helping each others,Join them
Share your post

Bootstrap modal popup header close button is not working

My bootstrap close modal not working not and not found any JavaScript error with console.

I added close button in model header, shared my popup html code also

My model html

<!-- Modal  popup--> 
<div class="modal fade" id="sampleModel" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
  <div class="modal-header">
  <h5 class="modal-title" id="bsModelTitle">Title </h5>
  <button type="button" id="btnModeClose" class="close" data-dismiss="modal" aria-label="Close">
     <span aria-hidden="true">&times;</span>
   </button>
 </div>
 
  <div id="ModelData" class="modal-body">
     My model body content
   </div>
    <div class="modal-footer">
    <button id="btOk" type="button" class="btn btn-success">OK</button>
    <button id="btCancel" type="button" class="btn btn-warning" data-dismiss="modal">Cancel</button>
    </div>
   </div>
  </div>
  </div>

please provide solution for this issue 

Answers


It should work but may be impacted some code customization or additional.jsfile changes.

Add following code in your popup code,

$("#btnModeClose").on("click", function (e) {
        e.preventDefault();
        $("#sampleModel").modal("hide");
        $('#sampleModel').data("modal", null);
    }); 

Share your answer


Share as a guest

Please subscribe me to the CodeChef4U.

By creating your new answer, you agree to the privacy policy and terms of service.