Set selected values in initialization

[andriijas]

Using the Email Contacts example here: http://brianreavis.github.io/selectize.js/#tabs

var REGEX_EMAIL = '([a-z0-9!#$%&\'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&\'*+/=?^_`{|}~-]+)*@' +
                  '(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?)';

$('#select-to').selectize({
    persist: false,
    maxItems: null,
    valueField: 'email',
    labelField: 'name',
    searchField: ['name', 'email'],
    options: [
        {email: 'brian@thirdroute.com', name: 'Brian Reavis'},
        {email: 'nikola@tesla.com', name: 'Nikola Tesla'},
        {email: 'someone@gmail.com'}
    ],
    render: {
        item: function(item, escape) {
            return '<div>' +
                (item.name ? '<span class="name">' + escape(item.name) + '</span>' : '') +
                (item.email ? '<span class="email">' + escape(item.email) + '</span>' : '') +
            '</div>';
        },
        option: function(item, escape) {
            var label = item.name || item.email;
            var caption = item.name ? item.email : null;
            return '<div>' +
                '<span class="label">' + escape(label) + '</span>' +
                (caption ? '<span class="caption">' + escape(caption) + '</span>' : '') +
            '</div>';
        }
    },
    create: function(input) {
        if ((new RegExp('^' + REGEX_EMAIL + '$', 'i')).test(input)) {
            return {email: input};
        }
        var match = input.match(new RegExp('^([^<]*)\<' + REGEX_EMAIL + '\>$', 'i'));
        if (match) {
            return {
                email : match[2],
                name  : $.trim(match[1])
            };
        }
        alert('Invalid email address.');
        return false;
    }
});

Is there anyway way to pass in whats going to be the selected value? I can set it afterwards but that would trigger the onChange event which is not what I want.

[brianreavis]

Hmm, I'm not totally following. What do you mean by "pass in what's going to be the selected value"? And at what point is that going to happen?

[andriijas]

rather than doing selectize.setValue(5) after initialization id like to pass in 5 to the initialization above

[netaisllc]

Brian, I think the impetus for the question is this:

How to set the selected item in advance of the Selectized object's initialization. In other words, how to set - through configuration - the equivalent of I'm selected.

This is actually my questions, and if it's already covered somewhere I sure couldn't find it. :)

[andriijas]

Thanks for explaining for me @netaisllc

[dsharer]

Is this currently not an option to initialize the value through a config setting?

[andriijas]

Nope

On Friday, May 23, 2014, David Sharer notifications@github.com wrote:

Is this currently not an option to initialize the value through a config
setting?

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/277#issuecomment-43958869
.

[dsharer]

If I submit a pull request do I have to make changes to both standalone and regular selectize.is?

[nlwillia]

You're looking at the dist folder. The file you want to change is src/selectize.js. The build process will then produce the files in dist for you (but you should exclude those generated files from your commit/PR). See the notes at the bottom of the front page for more on building/contributing.

[NotSqrt]

👍

I regularly use $element.selectize({options: [{"value": yy, "text": "label"}]});, then call selectize.setValue(id)
and would be very happy with something like:

{
    options: [
         {value: id, text: "label", selected: true},
         {value: id, text: "label", selected: true},
         {value: id, text: "label", selected: false},
    ],
    selectedField: "selected"
}

[thbar]

It would indeed make sense (speaking as a newcomer!) - took me a bit of time to figure out how to achieve this.

[garygreen]

+1, just run into this. I was trying to do like @NotSqrt with passing selected: true with the options but did nothing.

[yankeeinlondon]

I think this is an important addition and I'd really like to see an example of it near the top of the documentation. It is a use-case almost everyone will need.

[NotSqrt]

@brianreavis Do you have some time to look into this ?

[joshuataylor]

setValue also triggers a change of input which will trigger a bind event, however setTextboxValue for an input doesn't.