Two click for show the form. I need only one! [not solved]

Hello, I wrote this code to show on my website (based on WooCommerce) the “RESERVED NEGOTIATION” button every time a product on sale is not associated with a price .
At the click you must show me a form (contact form 7).

The problem is that you need two clicks on the button to show the form.

After the first click on the “RESERVED NEGOTIATION” button, another click on “REQUEST” is required to show the form.

I only want the first one.

Can you help me make this change?

Thank you very much!


This is the code

<?php
/**
 * @snippet       Show button when the field is blank in a simple product
 * @testedwith    WooCommerce 
 */
 
add_filter('woocommerce_empty_price_html', 'newbutton_poa_and_enquiry_cf7_woocommerce');
 
function newbutton_poa_and_enquiry_cf7_woocommerce() {
    $html = '<div class="poa">Fai il tuo affare</div>';
    $html .= '<button type="submit" id="trigger_cf" class="single_add_to_cart_button button alt"> TRATTATIVA RISERVATA </button>';
    $html .=  '<div id="product_inq" style="display:none">';
    $html .= do_shortcode('[contact-form-7 id="474" title="Senza titolo"]');
    $html .=  '</div>';
    return $html;
}

// --------------------------
// 2. Echo Javascript: 
// a) on click, display CF7
// b) and change CF7 button to "Close"
 
add_action( 'woocommerce_single_product_summary', 'newbutton_on_click_show_cf7_and_populate', 40);
 
function newbutton_on_click_show_cf7_and_populate() {
   
  ?>
    <script type="text/javascript">
        jQuery('#trigger_cf').on('click', function(){
        if ( jQuery(this).text() == 'Richiedi' ) {
            jQuery('#product_inq').css("display","block");
			jQuery("#trigger_cf").html('Chiudi'); 
        } else {
            jQuery('#product_inq').hide();
            jQuery("#trigger_cf").html('Richiedi'); 
        }
        });
    </script>
    <?php
       
}
<script type="text/javascript">
        jQuery('#trigger_cf').on('click', function(){
            jQuery('#product_inq').css("display","block");
            jQuery("#trigger_cf").html('Chiudi'); 
        });
</script>
1 Like

Thanks, but so the form is always shown

I need the form to be shown only if the “CONFIDENTIAL TREATMENT” button was clicked. How I can do?