Передать дата-атрибут в поле input
Есть кнопка, по которой вызывается всплывающее окно с формой заявки
<a data-product="Шкаф" class="button product_type_variable add_to_cart_button" href="#standard-modal" data-bs-toggle="modal" data-modal-title="Купить в 1 клик" data-modal-subtitle="Мы перезвоним вам в ближайшее время" rel="nofollow">Выбрать</a>
Сама форма:
<form action="telegram.php" method="POST" class="" novalidate="">
<div class="form-group">
<p class="form-label">Имя</p>
<div class="form-control-wrapper">
<input type="text" class="form-control" name="billing_first_name" placeholder="Имя Фамилия" autocomplete="first_name" required/="">
<div class="invalid-tooltip">Заполните поле</div>
</div>
</div>
<div class="form-group">
<p class="form-label">Телефон</p>
<div class="form-control-wrapper">
<input type="text" class="form-control" name="billing_phone" placeholder="Ваш телефон" autocomplete="phone" required/="">
<div class="invalid-tooltip">Заполните поле</div>
</div>
</div>
<div class="form-group">
</div>
<input type="hidden" class="form-control" name="product" value="Товар0">
<button class="btn btn-black">Отправить</button>
</form>
Я хочу, чтобы значение дата-атрибута передавалось в <input type="hidden" class="form-control" name="product" value="Товар0">
Нашел такой код, но он не работает почему-то
<script type="text/javascript">
document.querySelector('a.add_to_cart_button').addEventListener('click',(event)=>{
let inputText = document.querySelector('form input[type="hidden"]');
inputText.value = event.target.dataset.product;
event.preventDefault ? event.preventDefault() : (event.returnValue=false);
}, false);
</script>