I have index.php which calls other test.php using jQuery and loads the contents in one div tag.
But if I put modal in echo
of test.php it doesn't work. Modal does not open.
Here is my index.php
<html>
<head>
<link type="text/css" rel="stylesheet" href="css/bootstrap.css">
<link type="text/css" rel="stylesheet" href="css/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</head>
<body>
<div id="try"></div>
</body>
<script>
function loadUnSolved(){
$("#try").load("test.php");
}
$(document).ready(loadUnSolved());
</script>
</html>
test.php
<?php
echo '
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="modal12">Otryl</button>
<!-- Modal -->
<div id="modal12" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<p>text</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>';
?>
I think the problem is in $(document).ready()
Try the following
Index.php :
<script>
function loadUnSolved(){
$("#try").load("test.php");
}
$(document).ready(function(){loadUnSolved()});
</script>
test.php :(you missed the # symbol)
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#modal12">Otryl</button>
you need add a closure
$(document).ready(function(){
loadUnSolved();
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.