Description:
In this example we explain that how to dynamically
change the bootstrap modal popup body using JavaScript or jQuery. Or how to
open bootstrap modal popup on button click event and change the body of the bootstrap
modal using JavaScript or jQuery. Or how to set bootstrap modal text
dynamically using jQuery. Or how to bind the modal popup body dynamically using
JavaScript or jQuery.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>How to dynamically change bootstrap modal body </title>
<script
type="text/javascript">
$(function
() {
$('.custom-modal').click(function (e) {
e.preventDefault();
var
mymodal = $('#myModal');
mymodal.find('.modal-body').text('hello');
mymodal.modal('show');
});
})
</script>
</head>
<body>
<button
class="btn
btn-primary btn-lg custom-modal">
Open Modal</button>
<div
class="modal
fade" id="myModal"
role="dialog">
<div class="modal-dialog modal-mg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
×</button>
<h4 class="modal-title">
Message</h4>
</div>
<div class="modal-body">
<p>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">
Close</button>
</div>
</div>
</div>
</div>
</body>
</html>
0 comments:
Post a Comment