<a onclick="insertModal( this.dataset.id )" class="btn btn-primary" data-id="1" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a onclick="insertModal( this.dataset.id )" class="btn btn-primary" data-id="2" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a onclick="insertModal( this.dataset.id )" class="btn btn-primary" data-id="3" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a onclick="insertModal( this.dataset.id )" class="btn btn-primary" data-id="4" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<div class="modal fade" id="modal-example" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<!-- заголовок -->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Закрыть">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">TEST</h4>
</div>
<div class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Закрыть</button>
<button type="button" class="btn btn-primary">Сохранить</button>
</div>
</div>
</div>
</div>
const modalBody = document.querySelector('div.modal-body');
console.log(modalBody);
function insertModal(id){
console.log(id);
modalBody.innerHTML = '<p> ID кнопки: '+id+'</p>';
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.