Ajax уведомление о подписке
Всем привет! Возникла у меня проблема, сделал уведомление о подписке но не могу понять как сделать, чтобы менялось содержимое уведомления. Кто то может помочь в данном вопросе, если что скрипт на JS.
$('a.button').click(function(e) {
e.preventDefault();
$.post('{% url "user_follow" %}', {
id: $(this).data('id'),
action: $(this).data('action')
},
function(data) {
if (data['status'] == 'ok') {
var previous_action = $('a.button').data('action');
// toggle data-action
$('a.button').data('action',
previous_action == 'follow' ? 'unfollow' : 'follow');
// toggle link text
$('a.button').text(
previous_action == 'follow' ? 'Unfollow' : 'Follow');
// update total followers
var previous_followers = parseInt(
$('span.count .total').text());
$('span.count .total').text(previous_action == 'follow' ? previous_followers + 1 : previous_followers - 1);
}
}
);
});
// добавляем в DOM контейнер для сообщений
if (!document.querySelector('.messages')) {
const container = document.createElement('div');
container.classList.add('messages');
container.style.cssText = 'position: fixed; top: 15px; right: 15px; width: 250px;';
document.body.appendChild(container);
}
// получаем контейнер
const messages = document.querySelector('.messages');
// при нажатию на кнопку добавляем в контейнер alert
if ($('a.button').data('action')) {
document.querySelector('[data-create="message"]').addEventListener('click', () => {
const messageText = 'Follow {{ user.username }}';
const message = document.createElement('div');
message.className = 'alert alert-success alert-dismissible fade show';
message.innerHTML = `${messageText}<button type="button" class="close" data-dismiss="alert">×</button>`;
messages.appendChild(message);
});
} else if ($('a.button').data('action') != 'follow') {
document.querySelector('[data-create="message"]').addEventListener('click', () => {
const messageText = 'Unfollow {{ user.username }}';
const message = document.createElement('div');
message.className = 'alert alert-success alert-dismissible fade show';
message.innerHTML = `${messageText}<button type="button" class="close" data-dismiss="alert">×</button>`;
messages.appendChild(message);
});
}