cannot read property addOption on undefine in javascript selectize

Question

I am trying to implement search and each time getting this error... cannot read property 'addOption' on undefine in javascript selectize. I have checked that my result array have data.

My js code.

 var selectSearchValue, $selectSearchValue;
        var results = [];
        var list_selector = $('.data-list');

        list_selector.each(function (value) {

            results.push({
                id: $(this).attr('data-id'),
                name: $(this).attr('data-name'),
                code: $(this).attr('data-code'),
                hall: $(this).attr('data-hall'),
                location: $(this).attr('data-location')


            });

        });

        selectSearchValue.addOption(results);
        selectSearchValue.refreshOptions();


        $selectSearchValue = $('#searchItems').selectize({
            valueField: 'id',
            labelField: 'name',
            searchField: ['hall', 'name', 'code', 'location'],
            render: {
                option: function (item, escape) {
                    return '<div class="item-wrap">' +
                            '<span class="name">' + escape(item.hall) + '</span>' +
                            '<span class="code">' + escape(item.code) + '</span>' + '<div class="clearfix"></div>' +
                            '<span class="venue-name">' + escape(item.name) + ', </span>' +
                            '<span class="location">' + escape(item.location) + '</span>' +
                            '</div>';


                }


            }
        });
        selectSearchValue = $selectSearchValue[0].selectize;

score 1 · Accepted Answer · answered Jan 11 '16 at 16:59

1

You're trying to add options to selectSearchValue (line 19) before you've defined selectSearchValue (line 42).

answered Jan 11 '16 at 16:59

Draco18s no longer trusts SE

15,628
3
36
56

I have defined on the first line – Vikash Jan 11 '16 at 17:00
No, you declared it on the first line. You never set it *equal* to anything, ergo it is null (the default value for a complex data type). http://stackoverflow.com/questions/1410563/what-is-the-difference-between-a-definition-and-a-declaration – Draco18s no longer trusts SE Jan 11 '16 at 17:02
Add an example, what you have and what you would like to achieve ? – imrealashu Jan 11 '16 at 17:11
Take this two lines, `selectSearchValue.addOption(results);` and `selectSearchValue.refreshOptions();` and move them to the bottom. – Draco18s no longer trusts SE Jan 11 '16 at 17:13
thanks , that error gone, but when I am rendering the option then except the name all things are appearing undefined – Vikash Jan 11 '16 at 17:29
That's going to depend on the data returned by the AJAX query. You're going to need to insert some `console.log(...)` lines for debugging. – Draco18s no longer trusts SE Jan 11 '16 at 18:11
I have done this for result array,it has the data, but I am not getting how to test after selectSearchValue.refreshOptions(); lines, what I should put in console.log(), so that I get to know that the value is going into the options or not after rendering – Vikash Jan 11 '16 at 18:27
You've checked inside `option: function()` that `item.hall` contains meaningful data and that `escape(item.hall)` returns meaningful data? – Draco18s no longer trusts SE Jan 11 '16 at 18:29
No, its showing undefine in the options, but result[] had the data before addOption(results) – Vikash Jan 11 '16 at 18:38
I don't know, I am unfamiliar with selectize. "Why is this null" is a problem I can solve, "Why is my code not working the way I expect" is not. – Draco18s no longer trusts SE Jan 11 '16 at 18:55

cannot read property addOption on undefine in javascript selectize

1 Answers1