Отправить данные строки при нажатии кнопки?

Question

У меня есть следующий информационный объект

var data = [ 
       { 
         name: 'John Doe', 
         transactions: [{...},{...},{...}] 
       }, 
       {...}
    ];

Я вставляю эти данные в таблицу следующим образом:

function addRowsData(data) {
  var table = document.getElementById('main-table');
  var rowCount = table.rows.length;
  var tBody = document.createElement('tbody');

  table.appendChild(tBody);

  for (var i = 0; i < data.length; i++) {
    var info = data[i];
    var tr = tBody.insertRow();
    for(var key in info){
      if(key == 'transactions') continue;

      var td = document.createElement('td');

      td.innerHTML = info[key];
      tr.appendChild(td);
    }

    var tdButton = document.createElement('td');
    var button = document.createElement('button');
    var clientId = info.id;

    button.setAttribute('type', 'button');
    button.setAttribute('class', '"btn btn-primary');
    button.setAttribute('id', clientId);
    button.innerHTML = 'More'

    tdButton.appendChild(button);
    tr.appendChild(tdButton)    

    button.addEventListener('click', function() {
      openModal(info.transactions);
    });
  }
}

function openModal(transactions) {
  console.log(transactions);

  var modal = document.getElementById('my-modal');
  var close = document.getElementsByClassName('close')[0];

  close.addEventListener('click', closeModal, false);

  modal.style.display = 'block';
}

Каждая строка имеет кнопку, и при нажатии открывается модальное окно, в этом модальном окне я хочу показать данные из массива транзакций, я пробовал сделать это вот так openModal(info.transactions);, но это всегда показывает данные из последнего элемента. Есть ли способ достичь sh этого, чтобы при нажатии кнопки строки я мог получить доступ к массиву транзакций?

Answer 1

В вашем коде вы ссылаетесь на info в прослушивателе событий. Однако переменная info изменяется на протяжении всего for l oop, поэтому в конце for l oop информация будет последним индексом. Чтобы исправить это, возможно, вместо передачи info вы можете передать eval(data[i]), чтобы он вводил фактические данные вместо переменной, которая изменяется.