Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Detect no result return by search - Selectize.js

Is there any way to detect empty search result when working with Selectize.js?

If user types something and if they do not get the content from dropdown list, is there any way to detect the empty searches?

like image 649
Kim Kyo Avatar asked Sep 09 '14 08:09

Kim Kyo


2 Answers

Selectize.js has an event called onType. When user type something, onType event will fire. You just need to register this event when you initialise the Selectize.js. Then, you have to count total results return by the filter.

Here is the implementation:

$('select[name=country_id]').selectize({
      // When user type something, onType event will fire.
      onType  : function(text) {
        if ( ! this.currentResults.items.length) {
          $('#country-not-found').removeClass('hide');
        } else {
          $('#country-not-found').addClass('hide');
        }
      }
    });

For information please visit the following link:

https://github.com/brianreavis/selectize.js/blob/master/docs/usage.md#callbacks

like image 72
Anam Avatar answered Oct 15 '22 16:10

Anam


According to the documentation, selectize.js has an onChange event. You should be able to hook into that and check to see if the select list has any options or not. If not, you can run your "something else" code.

Check out the City / State Selection example in the link for more details on how to use the onChange event. Here is the demo's source code.

$select_state = $('#select-cities-state').selectize({
    onChange: function(value) {
        if (!value.length) return;
        select_city.disable();
        select_city.clearOptions();
        select_city.load(function(callback) {
            xhr && xhr.abort();
            xhr = $.ajax({
                url: 'http://www.corsproxy.com/api.sba.gov/geodata/primary_city_links_for_state_of/' + value + '.json',
                success: function(results) {
                    select_city.enable();
                    callback(results);
                },
                error: function() {
                    callback();
                }
            })
        });
    }
});
like image 42
Jeff Avatar answered Oct 15 '22 14:10

Jeff