Включите точное многопользовательский поиск заголовков узлов с помощью плагина поиска jstree.

Question

Я использую jstree search plugin (documentation) для поиска нескольких идентификаторов в полях заголовка моего дерева HTML.

Я взял оригинал jstree code (строка 3398) и сменил его, как предложено here, чтобы включить поиск нескольких слов в полях заголовка дерева.

Он отлично работает для «Название содержит» запросы (например, название ID: 40857332 из узла х и название ID: 408 узла у содержат искомое слово ID: 408), но я в догадках как изменить код, чтобы найти только точные соответствия (например, заголовок ID: 408 узла y соответствует поисковому слову ID: 408 точно).

Функция вызывается следующим образом:

$("#my_html_tree").jstree("search", search_words);

со следующими конфигурациями:

"search" : {"case_insensitive" : true, "search_method": "jstree_title_contains_multi"}

переменными "search_words" является строкой, содержащей несколько идентификаторов:

var search_words = "ID:4 ID:7 ID:3188"; 

Формат узлов HTML дерева:

<li id="3188"> <a title="ID:3188">Tree node 3188</a></li> 

Это мой изменил код:

$.expr[':'].jstree_title_contains_multi = function(a,i,m){ 

    var word, words = []; 
    var searchFor = m[3].toLowerCase().replace(/^\s+/g,'').replace(/\s+$/g,''); 
    if(searchFor.indexOf(' ') >= 0) { 
     words = searchFor.split(' '); 
    } 
    else { 
     words = [searchFor]; 
    } 
    for (var i=0; i < words.length; i++) { 
     word = words[i]; 
     if((a.getAttribute("title") || "").toLowerCase().indexOf(word) >= 0) { 
      return true; 
     } 
    } 
    return false; 

}; 

Как я должен изменить код, чтобы включить поиск только точных совпадений?

Любая помощь будет принята с благодарностью.

Answer 1

Я нашел следующее решение: Вместо использования

if((a.getAttribute("title") || "").toLowerCase().indexOf(word) >= 0) 

Я использую

if((a.getAttribute("title") || "").toLowerCase() === word) 

Answer 2

Это уборщик использовать идентификатор атрибута, а не название. Вы можете использовать оба.

Конфигурация:

"search" : {"case_insensitive" : true, 
      "search_method": "jstree_codigo_descripcion"} 

Поиск вызова

var codigo = "0102"; 
var descripcion = "sdf"; 
jQuery("#arbol").jstree("search",cod +"-"+ desc); 

Дерево

<div id="arbol"> 
    <ul> 
    <li><a>01</a> 
     <ul> 
     <li><a>0101</a> 
      <ul> 
      <li><a id="010101" title="foo">010101 foo</a></li> 
      <li><a id="010102" title="bar">010102 bar</a></li>     
      </ul> 
     </li> 
     <li><a>0102</a> 
      <ul> 
      <li><a id="010201" title="asdf">010201 asdf</a></li> 
      </ul> 
     </li> 
     </ul> 
    </li> 
    </ul> 
</div> 

Новая функция поиска

$.expr[':'].jstree_codigo_descripcion = function(a, i, m) { 
     var searchFor = m[3].toLowerCase(); 
     var params = searchFor.split('-'); 
     var codigo = params[0]; 
     var descripcion = params[1]; 

     // attribute id start with codigo 
     // attribute title contains descripcion 

     if (codigo.length > 0 && descripcion.length === 0) { 
      if ((a.getAttribute("id") || "").toLowerCase().indexOf(codigo) === 0) { 
       return true; 
      } 
     } 
     if (codigo.length === 0 && descripcion.length > 0) { 
      if ((a.getAttribute("title") || "").toLowerCase().indexOf(descripcion) >= 0) { 
       return true; 
      } 
     } 
     if (codigo.length > 0 && descripcion.length > 0) { 
      if ((a.getAttribute("id") || "").toLowerCase().indexOf(codigo) === 0 && 
        (a.getAttribute("title") || "").toLowerCase().indexOf(descripcion) >= 0) { 
       return true; 
      } 
     } 
     return false; 
    };