{"id":1435,"date":"2016-04-14T11:22:20","date_gmt":"2016-04-14T15:22:20","guid":{"rendered":"http:\/\/cfdbplugin.com\/?page_id=1435"},"modified":"2019-02-01T11:56:41","modified_gmt":"2019-02-01T16:56:41","slug":"create-a-select-tag-with-option-from-cfdb-submissions","status":"publish","type":"page","link":"https:\/\/cfdbplugin.com\/?page_id=1435","title":{"rendered":"Create a Form Drop-Down with values from CFDB submissions"},"content":{"rendered":"<p><strong>Situation<\/strong>: You have a CFDB form with submissions in the database. You would like to create another Contact Form 7 (CF7) form that has a drop-down list of\u00a0values that come from the values in the CFDB database.<\/p>\n<p><strong>Solution<\/strong>: Create a Contact Form 7 (CF7) Custom Form Tag that you can put in your new CF7 form definition. The custom tag should generate a SELECT with OPTION values\u00a0that you get from\u00a0CFDB similar to how you get CFDB data using\u00a0a CFDB shortcode.<\/p>\n<p>Create your solution based on the following example. In this example we create a CF7 custom tag [select_color] that we can put in a CF7 form definition. It create a SELECT (drop-down) of color choices.<\/p>\n<p>Assumptions:<\/p>\n<ul>\n<li>Using Contact Form 7<\/li>\n<li>We already have a form called &#8220;Color Choices&#8221;. It has a field called &#8220;color&#8221; and there are several submissions already saved in CFDB (red, orange, yellow, etc.)<\/li>\n<\/ul>\n<p>First, create a new CF7 Form with a\u00a0custom tag that we intend to create:<\/p>\n<pre lang=\"html\" line=\"1\" escaped=\"true\">\r\n<p>Pick a Color [select_color] <\/p>\r\n<p>[submit \"Send\"]<\/p>\r\n<\/pre>\n<p><a href=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-10.45.58-AM.png\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-10.45.58-AM-300x135.png\" alt=\"Screen Shot 2016-04-14 at 10.45.58 AM\" width=\"300\" height=\"135\" class=\"alignnone size-medium wp-image-1442\" srcset=\"https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-10.45.58-AM-300x135.png 300w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-10.45.58-AM-768x347.png 768w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-10.45.58-AM.png 795w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>The [select_color] custom tag does not work yet. We have to put in PHP code to tell CF7 what it means. <\/p>\n<p>I add the code using the <a href=\"https:\/\/wordpress.org\/plugins\/add-actions-and-filters\/\" target=\"_blank\">Add Shortcodes, Actions and Filters<\/a> plugin. Here is the example code. <\/p>\n<pre lang=\"php\" line=\"1\" escaped=\"true\">\r\n\/\/ 2nd argument: ensure it matches the name of the next function\r\nadd_action('wpcf7_init', 'add_cf7_shortcode_color');\r\n\r\n\/\/ Choose a unique function name\r\n\/\/ 1st argument: set to a unique name of the CF7 custom tag. You will us it in\r\n\/\/               your CF7 Form definition like this: [select_color]\r\n\/\/ 2nd argument: ensure it matches the name of the next function\r\nfunction add_cf7_shortcode_color() {\r\n    wpcf7_add_shortcode('select_color', 'select_color');\r\n}\r\n\r\n\/\/ Choose a unique function name\r\nfunction select_color() {\r\n    $form = 'Color Choices'; \/\/ set to the form name that has the values for the drop-down\r\n    $options = array();\r\n\r\n    \/\/ Use lines like this to set any CFDB shortcode options like show, filter, search, etc.\r\n    $options['show'] = 'color'; \/\/ You can delete this line\r\n\r\n    require_once(ABSPATH . 'wp-content\/plugins\/contact-form-7-to-database-extension\/CFDBFormIterator.php');\r\n    $exp = new CFDBFormIterator();\r\n    $exp->export($form, $options);\r\n\r\n    ob_start();\r\n\r\n    \/\/ Change \"color\" below to the name of the form field that you want\r\n    \/\/ for the custom CF7 tag [select_color]\r\n    echo '<select name=\"color\">';\r\n    \/\/ Put a blank choice at the top if you like\r\n    echo '<option value=\"\"><\/option>';\r\n    while ($row = $exp->nextRow()) {\r\n        \/\/ Change 'color' below to match your field name\r\n        printf('<option value=\"%s\">%s<\/option>', $row['color'], $row['color']);\r\n    }\r\n    echo '<\/select>';\r\n\r\n    $custom_tag = ob_get_contents();\r\n    ob_end_clean();\r\n    return $custom_tag;\r\n}\r\n<\/pre>\n<p><a href=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM.png\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM-300x172.png\" alt=\"Screen Shot 2016-04-14 at 11.04.23 AM\" width=\"300\" height=\"172\" class=\"alignnone size-medium wp-image-1450\" srcset=\"https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM-300x172.png 300w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM-768x441.png 768w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM-1024x588.png 1024w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.04.23-AM.png 1107w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>References<\/p>\n<ul>\n<li><a href=\"http:\/\/contactform7.com\/2015\/01\/10\/adding-a-custom-form-tag\/\" target=\"_blank\">Adding A CF7 Custom Form-Tag<\/a><\/li>\n<li><a href=\"http:\/\/cfdbplugin.com\/?page_id=367\" target=\"_blank\">Accessing CFDB Form Data via PHP<\/a><\/li>\n<\/ul>\n<p>Add your CF7 form shortcode to a page and see how it looks.<br \/>\n<a href=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.40-AM.png\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.40-AM-300x132.png\" alt=\"Screen Shot 2016-04-14 at 11.16.40 AM\" width=\"300\" height=\"132\" class=\"alignnone size-medium wp-image-1456\" srcset=\"https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.40-AM-300x132.png 300w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.40-AM.png 569w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p><a href=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.55-AM.png\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.55-AM-300x147.png\" alt=\"Screen Shot 2016-04-14 at 11.16.55 AM\" width=\"300\" height=\"147\" class=\"alignnone size-medium wp-image-1457\" srcset=\"https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.55-AM-300x147.png 300w, https:\/\/cfdbplugin.com\/wp-content\/uploads\/2016\/04\/Screen-Shot-2016-04-14-at-11.16.55-AM.png 611w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p><strong>Known Issues<\/strong><br \/>\nThe [select_color] tag creates a field named &#8220;color&#8221; (the SELECT tag NAME attribute). Some user might want to set the name in the CF7 form definition like this: [select_color <span style=\"background-color:yellow\">color<\/span>].<\/p>\n<p>That would require changing:<\/p>\n<pre lang=\"php\" line=\"9\" escaped=\"true\">\r\n    wpcf7_add_shortcode('select_color', 'select_color');\r\n<\/pre>\n<p>to<\/p>\n<pre lang=\"php\" line=\"9\" escaped=\"true\">\r\n    wpcf7_add_shortcode('select_color', 'select_color', true);\r\n<\/pre>\n<p>and changing:<\/p>\n<pre lang=\"html\" line=\"28\" escaped=\"true\">\r\n    echo '<select name=\"color\">';\r\n<\/pre>\n<p>to<\/p>\n<pre lang=\"html\" line=\"28\" escaped=\"true\">\r\n    echo '<select>';\r\n<\/pre>\n<p>My testing has shown that this <span style=\"background-color:yellow\">does NOT work<\/span>. You end up getting no value for the form submission less you explicitly set the SELECT NAME attribute. This appears to be an issue in CF7. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Situation: You have a CFDB form with submissions in the database. You would like to create another Contact Form 7 (CF7) form that has a drop-down list of\u00a0values that come from the values in the CFDB database. Solution: Create a Contact Form 7 (CF7) Custom Form Tag that you can put in your new CF7 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1250,"menu_order":12,"comment_status":"closed","ping_status":"closed","template":"page-without-sidebar.php","meta":{"jetpack_post_was_ever_published":false,"footnotes":""},"class_list":["post-1435","page","type-page","status-publish","hentry"],"jetpack_shortlink":"https:\/\/wp.me\/P1mptf-n9","jetpack_sharing_enabled":true,"jetpack-related-posts":[],"_links":{"self":[{"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/pages\/1435","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1435"}],"version-history":[{"count":27,"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/pages\/1435\/revisions"}],"predecessor-version":[{"id":1828,"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/pages\/1435\/revisions\/1828"}],"up":[{"embeddable":true,"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=\/wp\/v2\/pages\/1250"}],"wp:attachment":[{"href":"https:\/\/cfdbplugin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1435"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}