Тем самым Вы подтверждаете доводы Александра
Вы бы начали диалог
Если Вы решите изучить результат поисковой выдачи
А что можно еще домыслить
const modalTitle = document.querySelector('div.modal-title');
const modalBody = document.querySelector('div.modal-body');
const modalAction = document.querySelector('.modal-footer .button-primary');
function insertModal(el){ //добавим аргументов
modalTitle.innerHTML = el.dataset.title;
modalBody.innerHTML = '<p>'+el.dataset.body+el.dataset.id+'</p>';
modalAction.innerHTML = el.dataset.action;
}
<a
onclick="insertModal( this )"
class="btn btn-primary"
data-id="2"
data-title="Заявка на участие"
data-body="Участник №"
data-action="Принять"
role="button"
data-toggle="modal" href="#modal-example">узнать айди</a>
<a class="btn btn-primary" data-id="1" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a class="btn btn-primary" data-id="2" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a class="btn btn-primary" data-id="2" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
<a 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="1" role="button" data-toggle="modal" href="#modal-example">узнать айди</a>
insertModal( this.dataset.id )
// вызвать при клике функцию insertModal и предать ей собственный атрибут data-id
window.onload = () =>{
const modalBody = document.querySelector('#modal-example > .modal-body');
const insertModal = (id) => {
modalBody.innerHTML = '<p>'+id+'</p>';
}
}
<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>
<script>
window.onload = () =>{
const modalBody = document.querySelector('#modal-example > .modal-body');
const insertModal = (id) => {
modalBody.innerHTML = '<p>'+id+'</p>';
}
}
</script>
var exampleModal = document.getElementById('exampleModal'); // получаем окно
exampleModal.addEventListener('show.bs.modal', function (event) { //слушаем событие открытия
var button = event.relatedTarget; // получаем нажатую кнопку
var recipient = button.getAttribute('data-id'); //получаем атрибут, в котором записан id
var modalTitle = exampleModal.querySelector('.modal-title'); // хочу вставить в title - нахожу title
var modalBodyInput = exampleModal.querySelector('.modal-body input'); // еще хочу чтоб в input был id
modalTitle.textContent = 'Запрос цены ' + recipient; // вставляю в title текст + найденный id
modalBodyInput.value = 'Интересует ' +recipient; // вставляю в input текст + найденный id
})