Как скриптом заполнить поле Contact Form 7 при клике на див?

Question

[Алексей]

Есть CF7 форма

<span class="title-check">Выберите возраст ребенка:</span>
<div>
 <div class="my-checkbox" onclick="getAgeForm(this)">
  3-6
  <div> <img src="/wp-content/themes/hello-elementor/assets/images/check.svg"> </div>
 </div>
 <div class="my-checkbox" onclick="getAgeForm(this)">
  7-8
  <div> <img src="/wp-content/themes/hello-elementor/assets/images/check.svg"> </div>
 </div>
 <div class="my-checkbox" onclick="getAgeForm(this)">
  9-11
  <div> <img src="/wp-content/themes/hello-elementor/assets/images/check.svg"> </div>
 </div>
 <div class="my-checkbox" onclick="getAgeForm(this)">
   12+
  <div> <img src="/wp-content/themes/hello-elementor/assets/images/check.svg"> </div>
 </div>
</div>
[text* text-659 placeholder "Имя"]
[tel* tel-721 placeholder "Телефон"]
[text text-832 class:hide-age]
[submit "ЗАПИСАТЬСЯ"]

Последнее поле скрыто. При клике на див, текст из него должен заполнить скрытую форму. Делаю это следующим образом:

function getAgeForm(a){
	document.querySelector('.hide-age').value = a.textContent + ' лет';
}

При попытке отправить такую форму, ничего не происходит. Уведомление сообщает о том, что скрытое поле не заполнено. В чем ошибка?

Answer 1

[denisromanenko]

Вместо textContent используйте innerText.

textContent вам вернёт не то, что нужно. Вернее он вернёт как раз таки представление div в тексте, в том числе с навешанной функцией и прочей галиматьёй. Скорее всего потом валидация не проходит.

Вот про различия:
https://developer.mozilla.org/en-US/docs/Web/API/N...