Почему записывается только последний объект в хранилище?

Question

[ForSureN1]

Добрый день, нужно реализовать сохранение состояние radiobutton'ов в localstorage, по клику на радиобатон, получаю его состояние и вывожу все имеющиеся на странице, далее сохраняю эти объекты в один объект, и сохраняю в localstorage, но в LocalStorage попадает самый последний radiobutton на странице.
Заранее благодарю.

//Save checkbox reload page
  const test_container = document.querySelector('.general_test_slider')
  let checkInput = document.querySelectorAll('.question-row input')
  function requestCheckBox() {
    let checkBoxValue = {};
    for (let i = 0; i < checkInput.length; i++) {
      checkInput[i].addEventListener('click', saveCondition);
      console.log(checkBoxValue)
    }


    function saveCondition() {
      for(let i = 0; i < checkInput.length; i++) {
        checkBoxValue['checked'] =  checkInput[i].checked;
        console.log(checkBoxValue)
        saveCheckBox();
      }
    }

    function saveCheckBox() {
      localStorage.setItem('checkBox', JSON.stringify(checkBoxValue))
    }

  }

  if(test_container) {
    requestCheckBox();
  }

Answer 1

[zkrvndm]

localStorage.setItem('checkBox', JSON.stringify(checkInput));
save = localStorage.getItem('checkBox');
console.dir(save);

Comments

[ForSureN1]

То есть вот эта функция здесь вообще не нужна ?

function saveCondition() {
      for(let i = 0; i < checkInput.length; i++) {
        checkBoxValue['checked'] =  checkInput[i].checked;
        console.log(checkBoxValue)
        saveCheckBox();
      }
    }

и почему на переменную save не выводит ошибку что она undefined

[zkrvndm]

ForSureN1, конечно, ведь в checkInput у вас уже лежит массив со всей нужной инфой, осталось только его конвертировать в JSON и сохранить в хранилище.

[ForSureN1]

Надим Закиров, а теперь для того чтобы при обновлении страницы вывести эти данные из LocalStorage,
я создаю функцию, парсю localstorage, и через цикл for на checkInput[i] вешаю данные из localstorage?

[zkrvndm]

ForSureN1, да.

[ForSureN1]

Надим Закиров,

function getCheckBox() {
      let object = JSON.parse(localStorage.getItem('checkBox', checkInput))
      for (let i = 0; i < checkInput.length; i++) {
        checkInput[i].checked = object[i].checked
      }
    }

Вот, вот так получилось, все работает, спасибо вам большое )

Answer 2

[Rsa97]

Вы на каждой итерации цикла перезаписываете одно и то же поле объекта.
checkBoxValue['checked'] = checkInput[i].checked;