Установите значение поля скрытой формы HubSpot с помощью Javascript

#javascript #forms

Вопрос:

У меня есть небольшой фрагмент кода Javascript в заголовке веб-сайта:

 <!-- Unique form ID -->
<script>
   document.querySelector('input[name=form_submission_id]').value = new Date();
</script>
 

Моя цель — получить скрытое поле формы с именем «идентификатор отправки формы» для заполнения отметкой даты, но я продолжаю получать ошибку-Не удается установить значение свойства «значение» null

Если я зайду в инструменты инспектора и открою поле скрытой формы, приведенный выше код сработает, если он скрыт, я получу ошибку.

Вот ссылка на живую форму: https://easytrimreveals.com/samples/

Я предполагаю, что это загрузка формы после того, как сценарий уже запущен, но я не уверен, как это решить, если это так.

Я попытался создать задержку тайм-аута для запуска сценария, но это, похоже, тоже не сработало..

 <script>

  var formId = function() {
      document.querySelector('input[name=form_submission_id]').value = new Date();
  }
  document.onload = function() {
  setTimeout(formId, 3000);
}

</script>
 

Комментарии:

1. window.addEventListener('load', (event) => { document.querySelector('input[name="form_submission_id"]').value = new Date(); });

2. Попробовал это сделать, но получил ту же ошибку. Не удается установить значение свойства «значение» null.

3. Позаботьтесь о 'input[name="form_submission_id"]'

4. Я вставил кавычки, та же ошибка..

5. Похоже, вы используете форму Hubspot, размещенную внутри iframe. Я не слишком знаком с Hubspot, но я думаю, что вам, возможно, придется внести свои изменения в одно из событий, предоставляемых Hubspot (скорее всего, в событии onFormSubmit).


Ответ №1:

В итоге я получил помощь от друга, и это решено!

Спасибо за всю вашу помощь!

 <script>
window.addEventListener('message', event => {
   if(event.data.type === 'hsFormCallback' amp;amp; event.data.eventName === 'onFormReady') {
    document.getElementById("hs-form-iframe-0").contentDocument.querySelector('input[name="form_submission_id"]').value = new Date();
   }
});
</script>