mercredi 11 août 2021

Set checkbox value to true on specific pages

I have used Contact Form 7 to create a product enquiry form on each product page. The forms contains checkboxes for every product to help with the enquiry. How do I automatically set a specific product checkbox to true/on if the user is on the corresponding product page?

I've added a dynamic hidden field to the form which gets the page title.

Contact form &produce a checkbox array in the name field of each check box name="products[]"

Ideally i'd like the script to loop through and select checkbox that matches the hidden field, can somebody show me how to do this please?

Below is my current jquery

        $( document ).ready(function() {
            var get_product_name = $('#product-name').val(); // hidden field value
            if(get_product_name == 'product-page-title')
            {
              $('CHECKBOX_HERE').prop('checked', true);
            }
        });

HTML produced by contact form 7...

<span class="wpcf7-form-control-wrap page-title">
<input type="hidden" name="page-title" value="Product template" size="40" class="wpcf7-form-control wpcf7dtx-dynamictext wpcf7-dynamichidden" aria-invalid="false">
</span>

<span class="wpcf7-form-control-wrap products">
    <span class="wpcf7-form-control wpcf7-checkbox">
    
    <span class="wpcf7-list-item first"><label><input type="checkbox" name="products[]" value="Product One"><span class="wpcf7-list-item-label">Product One</span></label>
    </span> 
    <span class="wpcf7-list-item"><label><input type="checkbox" name="products[]" value="Product Two"><span class="wpcf7-list-item-label">Product Two</span></label>
    </span> 
    <span class="wpcf7-list-item"><label><input type="checkbox" name="products[]" value="Product Three"><span class="wpcf7-list-item-label">Product Three</span></label>
    </span> 
    <span class="wpcf7-list-item"><label><input type="checkbox" name="products[]" value="Product Four"><span class="wpcf7-list-item-label">Product Four</span></label>
    </span> 
    <span class="wpcf7-list-item last"><label><input type="checkbox" name="products[]" value="Product Five"><span class="wpcf7-list-item-label">Product Five</span></label>
    </span>

    </span>
</span>

As you can see I have limited skills




Aucun commentaire:

Enregistrer un commentaire