#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>