Gravity Forms is one of the best form plugins for WordPress powered websites. It allows you to quickly and easily create a form by dragging and dropping form elements into the editor, change their names, properties and settings. One of many elements available to use is the drop down field. You can either add the values manually using the form editor or populate all items dynamically via filters in your code.
For this example we will be covering dynamic drop down population via filters. We’ll end up with a drop down field populated with a list of movies, which is set up as a custom post type in our WordPress installation.
The first thing we’re going to do is add a new drop down field to our form. Here is what it looks like when you expand the edit options:
In order to keep it organized, and since we’re going to dynamically populate the items, we can delete all the default items (First Choice, Second Choice, Third Choice) that Gravity Forms adds when you add the field to the form.
If you check the official Gravity Forms documentation, you will see that it suggests you to write down the Field Id (in this example, id = 5) so you can use it in your code to target the correct element to be populated.
Even though this will work, I would prefer to add a class to the element and check for this class when targeting the element in the code. This way there’s no need to worry about ids, which sometimes can be a problem if you work with different environments or servers where the ids can be different on each installation.
For this field, we’re going to use the class name ‘movies-dropdown’, set under Appearance > Custom CSS Class on our drop down.
With our drop down set up in the form editor, it’s time to created the logic behind it. The filter we’ll be using is the ‘gform_pre_render’ filter, which is executed before the form is displayed and can be used to manipulate the Form Object prior to rendering the form.
Here is the code:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
add_filter('gform_pre_render', 'populate_movies'); //Note: when changing drop down values, we also need to use the gform_pre_validation so that the new values are available when validating the field. add_filter( 'gform_pre_validation', 'populate_movies' ); //Note: when changing drop down values, we also need to use the gform_admin_pre_render so that the right values are displayed when editing the entry. add_filter( 'gform_admin_pre_render', 'populate_movies' ); //Note: this will allow for the labels to be used during the submission process in case values are enabled add_filter( 'gform_pre_submission_filter', 'populate_movies' ); function populate_movies( $form ) { if ( $form['title'] != "Movies" ) return $form; foreach ( $form['fields'] as &$field ) { if ( $field->type != 'select' || strpos( $field->cssClass, 'movies-dropdown' ) === false ) { continue; } // you can add additional parameters here to alter the posts that are retrieved // more info: http://codex.wordpress.org/Template_Tags/get_posts $movie_ids = get_posts('fields=ids&posts_per_page=-1&post_status=publish&post_type=movie&order=asc&orderby=title'); // update 'Not listed Here' to whatever you'd like the instructive option to be $choices = array(array('text' => 'Not listed Here', 'value' => 0 )); foreach ( $movie_ids as $movie_id ) { $choices[] = array( 'text' => get_the_title( $movie_id ), 'value' => $movie_id, 'isSelected' => false ); } $field['choices'] = $choices; } return $form; } |
Gravity Forms is an great plugin and it allows you to build pretty much any custom functionality using its Hooks and Filters, and there are many others you can use. For more information and details about all of the Gravity Forms features, you can always refer to their official API Functions documentation.
Hope this helps and see you next time!
