Change placeholder after the instance is initialized.

[pedroandradedev]

I have a select to select the filter type and another to select the filter, depending on the type of filter I will change the options and I also want to change the placeholder. How do I change the placeholder of an instance even after it has already been initialized?

const filter = new TomSelect("#filter", {
    placeholder: "Select filter above"
})

new TomSelect("#filter_from", {
    placeholder: "Select...",
    onChange: function(item) {
        filter.setValue('')
        filter.clearOptions()
        switch (item) {
            case 'team':
                // Here I want to change the filter instance placeholder to: "Select team"
                filter.addOptions([
                    { value: 1, text: "Option 1" },
                    { value: 2, text: "Option 2" },
                    { value: 3, text: "Option 3" },
                ]);
            break;
            case 'user':
                // Here I want to change the filter instance placeholder to: "Select the user"
                filter.addOptions([
                    { value: 4, text: "Option 4" },
                    { value: 5, text: "Option 5" },
                    { value: 6, text: "Option 6" },
                ]);
            break;
        }
    }
})

[JoackimPennerup]

On the TomSelect instance there is a property called control_input that is the element used for input. You can change the placeholder property on that.

const ts = new TomSelect( ... );
ts.control_input.placeholder = "New placeholder";