在 Elementor 弹出窗口中填写输入字段

Question

I am trying to create a function which would fill input in popup window automatically depending on brn id that was clicked.

This is where I am at:

const btn = document.querySelector('.popup-activator')
let btnId

btn.addEventListener('click', function(){
   btnId = this.id;
});
document.getElementById("form-field-id").value = btnId; 

I can see that my id is saved in btnId, but it's not showing up in form field. It might be because when I click the button popup is not generated on the page yet, it opens after I click the button. Here is the link I am trying to do this https://www.avistech.cz/pujcovna-nakladace/ it's applied on first button 'Poptat'

If can anyone help I would really appriciate it

Answer 1

You need to assign the value to the input, when the modal is fully loaded.

const btns = document.querySelectorAll('.popup-activator')

btns.forEach(b => {
  b.addEventListener('click', function(){
    const btnId = this.id;
    // setting the value inside the fn so that it triggers after the button clicks
    // setTimeout delays the assignment a little so that the modal gets mounted
    setTimeout(() => {
      document.getElementById("form-field-id").value = btnId;
    })
  });
})