How can I allow users to type in their own options in a dropdown?

sking

Hello,

I need to have a dropdown in my Editor table where users can type in a new option if they one they want isn't listed. I'm doing this in a non-Editor dropdown using select2 because I also need the automatic search-while-you-type functionality. This is the code I'm using outside Editor.

    $("#dropdown").select2(
        {
            allowClear: true,
            createSearchChoice: function (term, data) {
                if ($(data).filter(function () {
                    return this.text.localeCompare(term) === 0;
                }).length === 0) {
                    return { id: term, text: term };
                }
            },
            multiple: false,
            data: options
        });

Is there a way to configure Editor's select2 plug in to take these same options? I'm not sure how to go about doing this.

Thanks for any advice!

allan

Hi,

You can pass select2 options directly into the control using the opts option for the field (docs - have a look specifically at the second example at the bottom of the page).

Regards,
Allan

sking

Is it possible to use the plugin with a select2 that is an <input> instead of a <select>?

allan

Must admit I didn't know it could do that! I know it can put its own text input in to allow easy selection of values, but the Editor plug-in will only create a select list. You could readily modify it if you want to create a text input - the element is created using conf._input = $('<select/>').

Regards,
Allan

allan

Update for anyone reading this - the input option has been deprecated in Select2 4.0. There is now a tags options which can be used to allow users to enter new data.

Allan