Как сделать сохранение текста из input?

Question

[ovsy]

Добрый вечер. У меня есть инпут, в который пользователь должен писать слова по очереди, мне нужно их сохранять, думаю, что в localStorage, чтобы потом их выводить

Разметка инпута и кнопки

<div class="dragArea row">
  <div class="col-lg-12 col-md-12 col-sm-12 form-group mb-3" data-for="name">
  <input type="text" name="name" placeholder="Ввод" data-form-field="name" class="form-control" value="" id="name-form6- 
    5"></div>
   <div class="col-auto mbr-section-btn align-center"><button type="submit" class="save btn btn-primary display-4">Принять</button></div>
</div>

Делаю сохранение при клике на кнопку save, но когда в консоле проверяю localStorage сохраненного текста нет.

let input = document.getElementsByClassName('form-control');
let save = document.querySelector('.save');

save.addEventListener('click', function () {
  localStorage.setItem('value', input.value)
})

Answer 1

[Сергей Соколов]

getElementsByClassName() возвращает не ваш input, а живую HTML-коллекцию с единственным элементом. У коллекции нет свойства value.

- let input = document.getElementsByClassName('form-control');
+ const input = document.querySelector('input.form-control');

Comments

[ovsy]

Спасибо за ответ, в value видно данные из инпута. Но в localStorage не сохраняется почему-то это значение

[ovsy]

Разобрался почему не добавлялось, поместил добавление в window.onload и все заработало)