Why i can't load options onDropdownOpen?

435 views Asked by At

Here is my code. I want to load options when dropdown is opened. It's loads data from ajax, but doesn't put it to dropdown right now.

selectize = selectAgentField.selectize({
  create: true,
  render: {
      option: function(item, escape) {
          console.log(item);
          return '<div>'+ escape(item.agent_name) + '</div>';
      }
  },
  onChange: function(value) {
    selectedValue = value;
  },
  onDropdownOpen: function() {
    WorkersService.getIdleWorkers(function(data) {
      selectize.clearOptions();
      _.each(data, function(worker, index) {
        selectize.addOption({value: index, text: worker.attributes.name, contact_uri: worker.attributes.contact_uri});
      })
      selectize.refreshOptions(false);
    });
  }
})[0].selectize;
1

There are 1 answers

0
Yoihito On

I didn't find clear answer why code above doesn't work. But here is my code-hack. I bind update on onFocus event so update is triggered when I click on control.

selectize = selectAgentField.selectize({
  create: false,

  onChange: function(value) {
    selectedValue = value;
  },

  // <<<<<< Here is solution >>>>>>
  onFocus: function() {
    WorkersService.getIdleWorkers(function(data) {
      selectize.clearOptions();
      _.each(data, function(worker, index) {
        selectize.addOption({value: index, text: worker.attributes.name, contact_uri: worker.attributes.contact_uri});
      });
      selectize.refreshOptions(true);
    });
  }
})[0].selectize;