Я пытаюсь перехватить изменения в компоненте datetimepicker опций продукта WooCommerce Extra. По сути, это просто средство выбора даты и времени.
У меня есть:
<script>
var box = document.getElementById("myDateTimePicker");
//console.log("#devlog: Active");
box.addEventListener("blur", function(){
var selectedDate = box.value;
console.log(selectedDate);
});
</script>
Что почти работает. Он выводит предыдущее значение, содержащееся в datetimepicker, а не значение, на которое он только что был изменен.
Я пробовал диапазон событий в eventListener, но, похоже, ничего не помогло. Может ли какая-то добрая душа избавить меня от моих страданий и подсказать, как получить НОВОЕ значение из указателя даты и времени при его изменении? Спасибо.
Обновление:
Вот html из формы. Компонент, с которым я борюсь, - это средство выбора даты внутри последнего <tr>
.
<form class="cart" action="http://blahblahblah:8888/product/191/" method="post" enctype='multipart/form-data'>
<input type="hidden" id="thwepof_product_fields" name="thwepof_product_fields" value="name_of_skater,tel_number,which_day" />
<table class="thwepo-extra-options thwepo_simple" cellspacing="0">
<tbody>
<tr>
<td colspan="2" class="section-title">
<h3 class="">Mandatory information</h3></td>
</tr>
<tr class="">
<td class="label leftside">
<label class="label-tag ">Name of skater</label> <abbr class="required" title="Required">*</abbr></td>
<td class="value leftside">
<input type="text" id="name_of_skater" name="name_of_skater" value="" class="thwepof-input-field validate-required">
</td>
</tr>
<tr class="">
<td class="label leftside">
<label class="label-tag ">Telephone number</label> <abbr class="required" title="Required">*</abbr></td>
<td class="value leftside">
<input type="tel" id="tel_number" name="tel_number" value="" class="thwepof-input-field validate-required">
</td>
</tr>
<tr class="">
<td class="label leftside">
<label class="label-tag ">Pick a day <b>only</b></label> <abbr class="required" title="Required">*</abbr></td>
<td class="value leftside">
<input type="text" autocomplete="off" id="which_day" name="which_day" value="" class="thwepof-input-field thwepof-date-picker validate-required" data-readonly="no">
</td>
</tr>
</tbody>
</table>
<div class="quantity hidden">
<input type="hidden" id="quantity_5e583e6ca4c48" class="qty" name="quantity" value="1" />
</div>
<button type="submit" name="add-to-cart" value="191" class="single_add_to_cart_button button alt">Add to basket</button>
</form>