Plugins can be included individually (using Bootstrap’s individual *.js files), or all at once (using bootstrap.js or the minified bootstrap.min.js). You may also like Live Search in php with Ajax and Mysql and How to search record in mysql codeigniter.
HTMl Code and Jquery Code
<!DOCTYPE html>
<html lang="en">
<head>
<title>Banner Modal Demo</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Banner Modal</h4>
</div>
<div class="modal-body">
<img style="width: 100%;" src="http://webwatchdogs.net/wp-content/uploads/2011/05/gallery-and-demo-banner-950x198.jpg" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$('document').ready(function(){
$('#myModal').modal('show');
});
</script>
</body>
</html>
