Сохранить идентификатор пользователя в хранилище сеансов с ошибкой?

#javascript #jquery

Вопрос:

Я хочу сохранить переменную «клиенты[i]._id» и отправить ее на другую страницу, когда я нажму кнопку в цикле for.Я хочу позже использовать этот идентификатор, чтобы получить более конкретную информацию об этом клиенте в отдельном окне.

Я получаю неопределенную ошибку, когда клиенты не определены. Также консоль.войти в магазин(функция) не работает. Можете ли вы найти, что не так?

 let thisArray = [];
//let clientId = $('#clientId').val();

$.ajax({
  method: 'GET',
  url: '/auth/clientsGET',
  dataType: 'json',
  success: function(clients) {
    thisArray = clients
    buildTable(thisArray);
    console.log(thisArray);
  }
})

function buildTable(clients) {
  let table = document.getElementById('tabelaClientesAdmin')

  for (let i = 0; i < clients.length; i  ) {
    let row = `<tr>
      <td>${clients[i]._id}</td>
      <td>${clients[i].name}</td>
      <td>${clients[i].admin}</td>
      <td><button type="button" class="btn btn-primary" onclick="store()">Ver Cliente</button></td>
    </tr>`
    table.innerHTML  = row
  }
}

function store() {
  console.log("Trying to get clientId....")
  
  let clientId = clients._id;
  sessionStorage.setItem("clientId", clientId);
  location.href = "./ver_cliente";
}
 

Я сразу же обновлю информацию, когда потребуется информация.

Комментарии:

1. clients не входит в сферу действия store() функции. Даже если бы это было так, из контекста, в котором он используется в других местах, он выглядит как массив, поэтому вам нужно получить к нему доступ по индексу, прежде чем извлекать _id из него свойство.

2. @RoryMcCrossan, значит, это только в рамках buildTable, потому что он получил это из ajax, правильно? И я не могу передать его в store (), потому что сначала мне нужно получить доступ по индексу ? (Пытаясь понять)

Ответ №1:

Вы могли бы передать индекс вот так:

 onclick="store(${i})"
 

затем извлеките его вот так:

 function store(index) {
  const clientId = thisArray[index]._id;
  sessionStorage.setItem("clientId", clientId);
}
 

Ответ №2:

Вот немного измененный, но рабочий пример вашей страницы:

Самая важная часть, вероятно,:

 let clientId= ev.target.closest("tr").children[0].textContent;
 

где я перехожу от нажатой кнопки ( ev.target ) через родителя — <tr> к первому ребенку (a <td> ). Там я прочитал textContent , преобразовал его в целое число с помощью унарного оператора и сохранил его в переменной clientId .

Я также представил глобальную переменную clients , которую можно использовать для дальнейшего использования на странице. Но в настоящее время этот массив на самом деле нигде не используется.

 var clients
$.ajax({
  method: 'GET',
  url: 'https://jsonplaceholder.typicode.com/users',
  dataType: 'json',
  success: function(d) {
    clients = d
    buildTable(clients);
    console.log(clients);
  }
})

function buildTable(clients) {
  let table = document.getElementById('tabelaClientesAdmin')

  for (let i = 0; i < clients.length; i  ) {
    let row = `<tr>
      <td>${clients[i].id}</td>
      <td>${clients[i].name}</td>
      <td>${clients[i].username}</td>
      <td><button class="btn btn-primary">Ver Cliente</button></td>
    </tr>`
    table.innerHTML  = row
  }
}

document.body.onclick=function(ev) {
 if (ev.target.tagName==="BUTTON") {
  let clientId= ev.target.closest("tr").children[0].textContent;
  console.log("Trying to get clientId:",clientId);
  // sessionStorage.setItem("clientId", clientId); // not in SO snippets
  console.log("go to ./ver_cliente");
}} 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="tabelaClientesAdmin"></table>