Почему у меня здесь вылазит ошибка Uncaught TypeError: Cannot set properties of null (setting 'textContent')

Искал ошибку в id, но все равно не удачно. Что ему не нравится?? html

  <form class="popup__form" name="new-place" id="popup__form" novalidate>
    <input type="text" name="place-name" class="popup__input popup__input_type_card-name" id="name_mesto" placeholder="Название" minlength="2" maxlength="30" data-error="Разрешены только латинские, кириллические буквы, знаки дефиса и пробелы" required>
    <span class="popup__input_type_error popup__error_visible" id="name-error"></span>
    <input type="url" name="link" class="popup__input popup__input_type_url" placeholder="Ссылка на картинку" id="profile_mesto" required>
    <span class="popup__input_type_error popup__error_visible" id="url-error"></span>
    <button type="submit" class="button popup__button popup__button_disabled">Сохранить</button>
  </form>

JS

import { enableValidation } from './scripts/validation.js';

enableValidation({
  formSelector: '.popup__form',
  inputSelector: '.popup__input',
  submitButtonSelector: '.popup__button',
  inactiveButtonClass: 'popup__button_disabled',
  inputErrorClass: 'popup__input_type_error',
  errorClass: 'popup__error_visible'
});

export function showInputError(inputElement, errorMessage, settings) {
  const errorElement = document.getElementById(`${inputElement.id}-error`);
  inputElement.classList.add(settings.inputErrorClass);
  errorElement.textContent = errorMessage;
  errorElement.classList.add(settings.errorClass);
}

export function hideInputError(inputElement, settings) {
  const errorElement = document.getElementById(`${inputElement.id}-error`);
  inputElement.classList.remove(settings.inputErrorClass);
  errorElement.textContent = '';
  errorElement.classList.remove(settings.errorClass);
}

export function enableValidation(settings) {
  const forms = document.querySelectorAll(settings.formSelector);
  forms.forEach(formElement => {
    formElement.addEventListener('submit', evt => {
      evt.preventDefault();
    });

    const inputList = formElement.querySelectorAll(settings.inputSelector);
    inputList.forEach(inputElement => {
      inputElement.addEventListener('input', () => {
        checkInputValidity(inputElement, formElement, settings);
      });
    });
  });
}

function checkInputValidity(inputElement, formElement, settings) {
  const errorMessage = inputElement.dataset.error;

  const regExp = /^[a-zA-Zа-яА-Я\s-]*$/;

  if (!regExp.test(inputElement.value)) {
    showInputError(inputElement, errorMessage, settings);
  } else {
    hideInputError(inputElement, settings);
  }

  const isFormValid = Array.from(formElement.querySelectorAll(settings.inputSelector)).every(input => {
    const regExp = /^[a-zA-Zа-яА-Я\s-]*$/;
    return regExp.test(input.value);
  });

  const submitButton = formElement.querySelector(settings.submitButtonSelector);
  if (isFormValid) {
    submitButton.removeAttribute('disabled');
    submitButton.classList.remove(settings.inactiveButtonClass);
  } else {
    submitButton.setAttribute('disabled', true);
    submitButton.classList.add(settings.inactiveButtonClass);
  }
}

Ответы (0 шт):