Я пытаюсь установить значение в sessionStorage, но я столкнулся с проблемой, заключающейся в том, как я могу сохранить «ключ» sessionStorage по-разному в зависимости от того, что я нажимаю. Например, на изображении ниже, если бы я щелкнул в первом чате чата, я бы сохранил ключ «1», а во втором чате чата я бы сохранил ключ «2». Эти значения ключа являются значениями непосредственно из вызова ajax ниже. Элементы HTML клонируются в зависимости от того, сколько записей у меня есть в вызове метода AJAX "GET". Таким образом, каждый из этих элементов (поле ниже) имеет уникальный «ключ» sessionStorage, который я хотел бы установить, когда нажимаю на «просмотр чата» этого конкретного окна.
HTML Файл
Скрипт
$.ajax({
url: 'http://localhost:8080/Retail-war/webresources/chat/retrieveChatsForUserForMerchant/' + uId,
type: 'GET',
dataType: 'json',
// Fetch the stored token from localStorage and set in the header
headers: { "Authorization": 'Bearer ' + sessionStorage.getItem('accessToken') },
success: function (data) {
// Get all chatItemBox by class
var chatItemBox = document.getElementsByClassName('chatItemBox');
console.log(chatItemBox)
// Get the last one
var lastChatItemBox = chatItemBox[chatItemBox.length - 1];
count = 0
$.each(data, function (key, entry) {
var chatItemBoxUsername = document.getElementById('chatItemBoxUsername').innerHTML = entry.createdBy.username
var chatItemBoxName = document.getElementById('chatItemBoxName').innerHTML = entry.createdBy.name
var chatItemBoxEmail = document.getElementById('chatItemBoxEmail').innerHTML = entry.createdBy.email
var chatItemBoxContact = document.getElementById('chatItemBoxContact').innerHTML = entry.createdBy.contactNumber
// Clone it
var newChatItemBox = lastChatItemBox.cloneNode(true);
newChatItemBox.className = 'col-12 col-sm-6 col-md-4 d-flex align-items-stretch chatItemBox' + count;
count = count + 1
console.log(newChatItemBox);
document.getElementById('chatItemBox').appendChild(newChatItemBox)
console.log(entry)
})
$('.chatItemBox').attr('id', 'toHide')
$('#toHide').remove();
console.log(data)
},
error: function (xhr, status, err) {
alert(err);
}
});