I'd like to inquire. On the page I made, products are displayed. It's not a "shop," but a page where you can inquire about the product if you have any questions while looking at it.
Click the "Inquiry" button at the top and the inquiry form will come down. In here, all the products on the page are in a check box. (The form is WordPress "wpforms" plug-in.)
What I want to inquire about is that can I check the check box in the "Inquiry Form" if I click a specific button such as product name while just looking at the product in the list?
Even if someone clicks the button on the product list, it will be convenient if it is checked in the check box of the inquiry form. But this is too hard for me...
url https://thepagegallery49.cafe24.com/wp/publication/
list
<div class="news-text-box">
<span class="news-date"><?php the_sub_field('pbauthor'); ?></span>
<span class="news-title"><?php the_sub_field('pbtitle'); ?></span>
<span class="news-text"><?php the_sub_field('pbdetail'); ?></span>
<span class="checkbutton">Check</span>
</div>
checkbox
<div id="wpforms-187-field_28-container" class="wpforms-field wpforms-field-checkbox wpforms-one-third" data-field-id="28">
<label class="wpforms-field-label" for="wpforms-187-field_28">Selection</label>
<ul id="wpforms-187-field_28">
<li class="choice-1 depth-1">
<input type="checkbox" id="wpforms-187-field_28_1" name="wpforms[fields][28][]"
value="Book title 1" class="wpforms-valid" aria-invalid="false">
<label class="wpforms-field-label-inline" for="wpforms-187-field_28_1">Book title 1</label>
</li>
<li class="choice-2 depth-1 wpforms-selected">
<input type="checkbox" id="wpforms-187-field_28_2" name="wpforms[fields][28][]"
value="Book title 2" class="wpforms-valid">
<label class="wpforms-field-label-inline" for="wpforms-187-field_28_2">Book title 2</label>
</li>
...
</ul>
</div>
Yes, you can achieve this by adding eventListener to the button you wish to be clicked in order to check the checkbox, and then in the callback function of the eventListener, set the value of checkbox accordingly.
<button id="btn">hi</button>
<input type="checkbox" id="checkbox"></input>
document.getElementById("btn").addEventListener("click", () => {
document.getElementById("checkbox").checked = true;
})
and for toggling the checkbox
document.getElementById("btn").addEventListener("click", () => {
var checkbox = document.getElementById('checkbox');
checkbox.checked = !checkbox.checked;
})