Posted on by

Pre-load a “Chosen” Dropdown with Options from the Database

The Chosen Dropdown add-on for Participants Database gives you the ability to use javascript-powered dropdown selectors in your forms. Normally, these dropdowns are populated with a static set of values in the field definition.

This tutorial shows how to populate your Chosen dropdown with values from the database.

For our tutorial here, we’re going to do something very simple: the field (named “Specialty”) is a Chosen Dropdown Other field where users can type in an additional value that is not on the preset list. What this does is make it possible for another person to select that new option in their form, giving you an essentially user-defined list of options for the dropdown.

Getting the Values

The core of this function (happens around line 30) is the database query that gets all the values that people have saved. If you are adapting something like this for your own purposes, you will need to be able to change this part of the function to get whatever list of options you want to use. This will require some knowledge of database queries, but WordPress makes this pretty simple.

To start with, we are simply going to query the database for all the unique values that have been saved. Then we add the ones that aren’t already present in the list of options to the preset values to get our final list of options.

Setting the Field’s New Options

Setting the field options is very simple, we simply need an array of values, then we set the “options” property of the field to that array. In this case, it’s a simple indexed array, so the saved value and what you see in the dropdown are exactly the same.

Participants Database also supports “value titles” where the visible part of the option can be different from the value that gets saved. You just need to construct your array as an associative array where the title is the key and the value is the value in each array element.

Here’s the Code

I tried to make the plugin code simple and well-commented so it’s easy to understand what is going on here.

As always, go to the gist page and download the zip file if you want to install this plugin.

12 thoughts on “Pre-load a “Chosen” Dropdown with Options from the Database

  1. hi, Roland, I have purchased and installed Chosen Dropdown Element add-on plugin but I have a problem with the search box in a dropdown field it does not exist I have changed the number in Disable Search Threshold but nothing the problem I have purchased this addon for this purpose can you help pls thank you

    1. I will really need to see this in action to help you with this. It is possible there is some other javascript or even some CSS that is interfering with the normal operation of the Chosen Selector.

      1. use this code to enter my website 2512 because is not ready to make it public but when you enter change the language i menu and click register button to see my problem in city field dropdown thank you

        1. If your site is multilingual, that may not works as expected with the chosen dropdown autosuggest.

          If you want to send me a private link you can send it to support@xnau.com.

  2. thank you roland for this awesome plugin i want to know how i can add autocomplete search box in dropdown field
    for example i have set dropdown field for cities and i have long list i need search box to allow users to use it for choosing name of city thank you

    1. You can use the Chosen Selector add-on for this: it provides an autosuggest that show possible choices as the person types.

  3. Hi Roland,

    I purchased and installed the Chosen Dropdown Element add-on plugin. I then ran through the code posted above – installed the PDB populate chosen dropdown. But, in my signup and record edit pages, I can’t get the dropdown to show any values. Do I need to change the code in the pdb-populate-dropdown.php to recognize my fields? I did not change anything in that code and just installed the .zip file that I downloaded.

    Thanks!

    1. Yes, you must edit the code in the example for it to work on your site. You can do this using the WordPress built-in plugin editor, or you can edit the file on your computer, then upload it using FTP.

      1. That makes sense, thanks! So, stupid question… do I change the field name of “specialty” to my own field name, in line 23?

        // this is the name of the field we want to add options to
        $fieldname = ‘specialty’;

        And, is there a way to add more than one field, or can this plugin only do just one chosen field?

        1. You will need to have an understanding of php and probably mysql to successfully use this plugin. Yes, you need to change the field that the plugin operates on, and yes, you can make it work on multiple fields, but knowing exactly how you need to do that is up to you.

        2. Thanks Roland. Changing the ‘specialty’ field to my field name worked. Now I just need to look up how to make it work for more than one field without breaking it!

          For sorting my results alphabetically in the dropdown list, would you suggest I sort the array that is made or should it come from an “order by” SQL function in the SQL statement?

        3. Just to follow up, using ORDER BY in the query got me results in alphabetical order:

          $query = ‘
          SELECT DISTINCT `’ . $fieldname . ‘`
          FROM ‘ . $wpdb->prefix . ‘participants_database
          ORDER BY `’ . $fieldname . ‘`’;

Leave a Reply
You have to agree to the comment policy.

12 thoughts on “Pre-load a “Chosen” Dropdown with Options from the Database

  1. hi, Roland, I have purchased and installed Chosen Dropdown Element add-on plugin but I have a problem with the search box in a dropdown field it does not exist I have changed the number in Disable Search Threshold but nothing the problem I have purchased this addon for this purpose can you help pls thank you

    1. I will really need to see this in action to help you with this. It is possible there is some other javascript or even some CSS that is interfering with the normal operation of the Chosen Selector.

      1. use this code to enter my website 2512 because is not ready to make it public but when you enter change the language i menu and click register button to see my problem in city field dropdown thank you

        1. If your site is multilingual, that may not works as expected with the chosen dropdown autosuggest.

          If you want to send me a private link you can send it to support@xnau.com.

  2. thank you roland for this awesome plugin i want to know how i can add autocomplete search box in dropdown field
    for example i have set dropdown field for cities and i have long list i need search box to allow users to use it for choosing name of city thank you

    1. You can use the Chosen Selector add-on for this: it provides an autosuggest that show possible choices as the person types.

  3. Hi Roland,

    I purchased and installed the Chosen Dropdown Element add-on plugin. I then ran through the code posted above – installed the PDB populate chosen dropdown. But, in my signup and record edit pages, I can’t get the dropdown to show any values. Do I need to change the code in the pdb-populate-dropdown.php to recognize my fields? I did not change anything in that code and just installed the .zip file that I downloaded.

    Thanks!

    1. Yes, you must edit the code in the example for it to work on your site. You can do this using the WordPress built-in plugin editor, or you can edit the file on your computer, then upload it using FTP.

      1. That makes sense, thanks! So, stupid question… do I change the field name of “specialty” to my own field name, in line 23?

        // this is the name of the field we want to add options to
        $fieldname = ‘specialty’;

        And, is there a way to add more than one field, or can this plugin only do just one chosen field?

        1. You will need to have an understanding of php and probably mysql to successfully use this plugin. Yes, you need to change the field that the plugin operates on, and yes, you can make it work on multiple fields, but knowing exactly how you need to do that is up to you.

        2. Thanks Roland. Changing the ‘specialty’ field to my field name worked. Now I just need to look up how to make it work for more than one field without breaking it!

          For sorting my results alphabetically in the dropdown list, would you suggest I sort the array that is made or should it come from an “order by” SQL function in the SQL statement?

        3. Just to follow up, using ORDER BY in the query got me results in alphabetical order:

          $query = ‘
          SELECT DISTINCT `’ . $fieldname . ‘`
          FROM ‘ . $wpdb->prefix . ‘participants_database
          ORDER BY `’ . $fieldname . ‘`’;

Leave a Reply
You have to agree to the comment policy.