Как изменить содержимое уведомления Bootstap 5
Хочу реализовать уведомление об удачной подписке. Подключил уведомления из Bootstrap, всё получилось. Проблема заключается в том, что нужно чтобы содержимое уведомления менялось при нажатии подписаться/отписаться, не могу понять как это реализовать. Вот скрипт:
<div id="liveAlertPlaceholder"></div>
<a style="float: right; position: relative; top: 5px;" href="#" data-id="{{ user.id }}" id="liveAlertBtn" data-action="{% if request.user in user.followers.all %}un{% endif %}follow" class="button" type="button">
{% if request.user not in user.followers.all %}
Follow
{% else %}
Unfollow
{% endif %}
</a>
<script>
const alertPlaceholder = document.getElementById('liveAlertPlaceholder')
const alert = (message, type) => {
const wrapper = document.createElement('div')
wrapper.innerHTML = [
`<div class="alert alert-${type} alert-dismissible" role="alert">`,
` <div>${message}</div>`,
' <a type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Закрыть"></a>',
'</div>'
].join('')
alertPlaceholder.append(wrapper)
}
const alertTrigger = document.getElementById('liveAlertBtn')
if (alertTrigger) {
alertTrigger.addEventListener('click', () => {
alert('Follow {{ user.username }}', 'success')
})
}
</script>
Пытался сделать через переменные ничего не получилось