How to set Dynamic Select List in Contact Form 7

Contact form 7 is one of the legendary plugins of WordPress. this plugin is widely used for contact us pages on most websites. some times it’s used to collect data from clients or customers. some times its needs to integrate with options in contact form 7  with dynamic options from the database. we can do this by WordPress hook. there is a hook in Contact form 7 to do that.  We can Populate a select field with dynamic data from any dynamic option, even from API too.

How to set Dynamic Select List in Contact Form 7

Add Hook to the Contact form 7

we will use wpcf7_form_tag filter to customize the select dropdown. we will check if the field is our targetted field or not by checking the field name. after getting the field we will add our data to the field.

Here is How we do it:
1: Add a filter by wpcf7_form_tag

function thedailywp_dynamic_select_field_values ( $scanned_tag, $replace ) { 
}
add_filter( 'wpcf7_form_tag', 'thedailywp_dynamic_select_field_values', 10, 2);

2: we will check the field name by parameter $scanned_tag, if not match with field name it will return

    if ( $scanned_tag['name'] != 'solutions' )  
        return $scanned_tag;

3: We will get our Dynamic value. we will show you by custom post type:

   $rows = get_posts(
    	array ( 
	     'post_type' => 'custom_post_type',  
        )
    );  
  
    if ( ! $rows )  
        return $scanned_tag;

4: Now populate this data into the field, return tag, and close function:

foreach ( $rows as $row ) {  
        $scanned_tag['raw_values'][] = $row->post_title . '|' . $row->post_title;
    }

    $pipes = new WPCF7_Pipes($scanned_tag['raw_values']);

    $scanned_tag['values'] = $pipes->collect_befores();
    $scanned_tag['labels'] = $pipes->collect_afters();
    $scanned_tag['pipes'] = $pipes;
  
    return $scanned_tag; 

Here is the full code of it

function thedailywp_dynamic_select_field_values ( $scanned_tag, $replace ) {  
  
    if ( $scanned_tag['name'] != 'solutions' )  
        return $scanned_tag;

    $rows = get_posts(
    	array ( 
          'post_type' => 'custom_post_type',   
        )
    );  
  
    if ( ! $rows )  
        return $scanned_tag;

    foreach ( $rows as $row ) {  
        $scanned_tag['raw_values'][] = $row->post_title . '|' . $row->post_title;
    }

    $pipes = new WPCF7_Pipes($scanned_tag['raw_values']);

    $scanned_tag['values'] = $pipes->collect_befores();
    $scanned_tag['labels'] = $pipes->collect_afters();
    $scanned_tag['pipes'] = $pipes;
  
    return $scanned_tag;  
}  

add_filter( 'wpcf7_form_tag', 'thedailywp_dynamic_select_field_values', 10, 2);

Now you can add this code to your custom plugin or you can add it to the theme functions.php file. you have to customize this function to your need. in step number three, where we get data you can replace your data source,  if you want to load data from API you can do it in step number three.

if you want to show different labels with different values, you can do it in step number four. we have to do it where we set the options for it, check out the below code:


$scanned_tag['raw_values'][] =  'Label | your_option_value' ;

Now you have to replace “Label” “your_option_value” with your label and options. Please comment below if you still don’t get it.  here is more tutorial about how to add Recaptcha in contact form 7, Recaptcha is important to spammers keep away. if you are using Contact form 7 you should add Recaptcha to your contact form 7.

One Comment