Search for multi language support chosen.js

Question

I want to search bar execute all words. Include Turkish letters (Ö, Ç, İ, Ş, Ğ, Ü). How can i expand chosen search bar for these words?

For example: i'll search "istanbul" but it say can't found "İstanbul" because "i" is lowercase.

How can i fix that?

https://github.com/harvesthq/chosen

Answer 1

If you want to search with special characters......

1. Open chosen.jquery.js
2. Replace method Chosen.prototype.winnow_results = function() with the following code.(Note that removeDiacritics() must be an implementation that removes special characters from string)

---

Chosen.prototype.winnow_results = function() {
      var found, option, optionHTML, part, parts, regex, regexAnchor, result, result_id, results, searchText, startpos, text, zregex, _i, _j, _len, _len2, _ref;
      this.no_results_clear();
      results = 0;
      searchText = this.search_field.val() === this.default_text ? "" : $('<div/>').text($.trim(this.search_field.val())).html();
      searchText = searchText.removeDiacritics();
      regexAnchor = this.search_contains ? "" : "^";
      regex = new RegExp(regexAnchor + searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), 'i');
      zregex = new RegExp(searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"), 'i');
      _ref = this.results_data;
      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
        option = _ref[_i];
        optionHTML = option.html.removeDiacritics();
        if (!option.disabled && !option.empty) {
          if (option.group) {
            $('#' + option.dom_id).css('display', 'none');
          } else if (!(this.is_multiple && option.selected)) {
            found = false;
            result_id = option.dom_id;
            result = $("#" + result_id);
            if (regex.test(optionHTML)) {
              found = true;
              results += 1;
            } else if (optionHTML.indexOf(" ") >= 0 || optionHTML.indexOf("[") === 0) {
              parts = option.html.replace(/\[|\]/g, "").split(" ");
              if (parts.length) {
                for (_j = 0, _len2 = parts.length; _j < _len2; _j++) {
                  part = parts[_j];
                  part = part.removeDiacritics();
                  if (regex.test(part)) {
                    found = true;
                    results += 1;
                  }
                }
              }
            }
            if (found) {
              if (searchText.length) {
                startpos = optionHTML.search(zregex);
                text = option.html.substr(0, startpos + searchText.length) + '</em>' + option.html.substr(startpos + searchText.length);
                text = text.substr(0, startpos) + '<em>' + text.substr(startpos);
              } else {
                text = option.html;
              }
              result.html(text);
              this.result_activate(result);
              if (option.group_array_index != null) {
                $("#" + this.results_data[option.group_array_index].dom_id).css('display', 'list-item');
              }
            } else {
              if (this.result_highlight && result_id === this.result_highlight.attr('id')) {
                this.result_clear_highlight();
              }
              this.result_deactivate(result);
            }
          }
        }
      }
      if (results < 1 && searchText.length) {
        return this.no_results(searchText);
      } else {
        return this.winnow_results_set_highlight();
      }
};

Here is my own implementation of removeDiacritics() (this is for Spanish special chars)

String.prototype.removeDiacritics = function() {
    var diacritics = [
        [/[\300-\306]/g, 'A'],
        [/[\340-\346]/g, 'a'],
        [/[\310-\313]/g, 'E'],
        [/[\350-\353]/g, 'e'],
        [/[\314-\317]/g, 'I'],
        [/[\354-\357]/g, 'i'],
        [/[\322-\330]/g, 'O'],
        [/[\362-\370]/g, 'o'],
        [/[\331-\334]/g, 'U'],
        [/[\371-\374]/g, 'u'],
        [/[\321]/g, 'N'],
        [/[\361]/g, 'n'],
        [/[\307]/g, 'C'],
        [/[\347]/g, 'c'],
    ];
    var s = this;
    for (var i = 0; i < diacritics.length; i++) {
        s = s.replace(diacritics[i][0], diacritics[i][1]);
    }
    return s;
};

Answer 2

i added some codes to solve problem to chosen library.

// Added following lines to 304 - 305 lines for version 1.0.0
var letters = { "İ": "[İi]", "I": "[Iı]", "Ş": "[Şş]", "Ğ": "[Ğğ]", "Ü": "[Üü]", "Ö": "[Öö]", "Ç": "[Çç]", "i": "[İi]", "ı": "[Iı]", "ş": "[Şş]", "ğ": "[Ğğ]", "ü": "[Üü]", "ö": "[Öö]", "ç": "[Çç]" };
escapedSearchText = escapedSearchText.replace(/(([İIŞĞÜÇÖiışğüçö]))/g, function(letter){ return letters[letter]; });

For full solution, you can look following link : https://gist.github.com/hkulekci/7091324

Answer 3

I solved this problem. Solution at the bottom;

String.prototype.turkce=function() {
  var str = [];
  for(var i = 0; i < this.length; i++) {
  var ch = this.charCodeAt(i);
  var c = this.charAt(i);
  if(ch == 105) str.push('İ');
  else if(ch == 305) str.push('I');
  else if(ch == 287) str.push('Ğ');
  else if(ch == 252) str.push('Ü');
  else if(ch == 351) str.push('Ş');
  else if(ch == 246) str.push('Ö');
  else if(ch == 231) str.push('Ç');
  else if(ch >= 97 && ch <= 122) str.push(c.toUpperCase());
  else str.push(c);
  }
  return str.join('');
}