How to display submitted values from Contact Form 7 form with var_dump() or printr() using plugin hooks

Question

I want to see what is inside "$name" variable, how can i do that?

add_action("wpcf7_before_send_mail", "wpcf7_do_something_else"); 

function wpcf7_do_something_else( &$WPCF7_ContactForm ) {
    $name = $WPCF7_ContactForm->posted_data['your-name'];
    var_dump($name);
}

Answer 1

CF7 uses AJAX to submit forms and you can't see var_dump() in ordinary way. So through PHP you can use WordPress debug.log file. Iside "wp-config.php" instead of define('WP_DEBUG', false); write:

// Enable WP_DEBUG mode
define( 'WP_DEBUG', true );

// Enable Debug logging to the /wp-content/debug.log file
define( 'WP_DEBUG_LOG', true );

// Disable display of errors and warnings
define( 'WP_DEBUG_DISPLAY', false );
@ini_set( 'display_errors', 0 );

Then:

add_action("wpcf7_before_send_mail", "wpcf7_do_something_else"); 

function wpcf7_do_something_else( &$WPCF7_ContactForm ) {

    $name = $WPCF7_ContactForm->posted_data['your-name'];

    ob_start();                     // start buffer capture

    var_dump($name);

    $contents = ob_get_contents();  // put the buffer into a variable
    ob_end_clean();                 // end capture
    error_log($contents);           // write the log file
}

As option you can do that in front-end with JS thru the CF7 DOM events
Example - when your form is submit:

<script>
document.addEventListener( 'wpcf7submit', function( event ) {
    var inputs = event.detail.inputs;

    for ( var i = 0; i < inputs.length; i++ ) {
        if ( 'your-name' == inputs[i].name ) {
            alert( inputs[i].value );
            /*
            or in console:
            console.log( inputs[i].value );
            */
            break;
        }
    }
}, false );
</script>