What is the `data-target` attribute in Bootstrap 3?
data-target attribute should contain a CSS selector that points to the HTML Element that will be changed.
<!-- Button trigger modal --> <button class=btn btn-primary btn-lg data-toggle=modal data-target=#myModal> Launch demo modal </button> <!-- Modal --> <div class=modal fade id=myModal tabindex=-1 role=dialog aria-labelledby=myModalLabel aria-hidden=true> [...] </div>
In this example, the button has
data-target=#myModal, if you click on it,
<div id=myModal>...</div> will be modified (in this case faded in).
This happens because
#myModal in CSS selectors points to elements that have an
id attribute with the
Further information about the HTML5 data- attribute: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes
The toggle tells Bootstrap what to do and the target tells Bootstrap which element is going to open. So whenever a link like that is clicked, a modal with an id of “basicModal” will appear.