Modals are used to provide a pop-up dialog style element that can be used to provide information to the user or even allow the user, to complete a form inside the modal. A Bootstrap modal is essentially made of three parts: a header, body, and footer. You can put any standard HTML markup inside the modal's
body element, including standard text or even an embedded YouTube video.
As a general rule, always place the modal's markup in a top-level position inside your view, the top or bottom of the view is the best place to put your modal markup.
In order to show a modal when a button is clicked, you can set the
data-target attributes of a Bootstrap button. For example, in the following HTML markup, a button's
data-toggle attribute has been set to modal and its
data-target attribute has been set to
<div class="row"> <button type="button" class="btn btn-primary btn-lg" data-toggle= "modal" data-target="#employeeModal">...