2017-02-05 7 views
0

Я использую autocomplete.js Algolia (в JQuery версия)Algolia автозаполнения - только показать, если больше, чем X результаты

Я хотел бы показать некоторые дополнительный текст в сноске ниспадающее меню, если и только если существует более 5 результатов для любого из двух источников данных, которые я ищу в пределах

т.е. «Просмотреть все/все результаты». Я бы предпочел показать это во внешнем нижнем колонтитуле (то есть не в нижнем колонтитуле, который относится только к одному источнику).

Во всех других условиях (например, в обоих источниках данных нет результатов или менее 5 в обоих источниках), Я бы хотел (а) скрыть этот текст

Как это сделать? Мой текущий код ниже

var index_classes = client.initIndex('classes'); 
    var index_stories = client.initIndex('articles'); 

$('input[name="search_text"]').autocomplete(
        { autoselect:true, debug:true, 
         templates: { 
          footer: '<span id="see-all-sr"><hr><a href="#" style="size:16px;padding-left:12px">See all results</a><br>&nbsp<span>' 
         } 
        }, [ 
        { 
         source: $.fn.autocomplete.sources.hits(index_classes, { hitsPerPage: 5 }), 
         displayKey: 'name', 
         name: 'class', 
         templates: { 
          header: '<div class="aa-suggestions-category">Classes</div>', 
          suggestion: function(suggestion) { 
           return '<img src="/images/class/' + suggestion.id + '_100.jpg">' + '<div><span>' + 
            suggestion._highlightResult.name.value + '</span><span>' 
            + suggestion._highlightResult.teacher_name.value + '</span>'; 
          }, 
          empty: '<div class="aa-empty">No results. See <a href="/classes">all classes</a></div>', 
         } 
        }, 
         { 
          source: $.fn.autocomplete.sources.hits(index_stories, { hitsPerPage: 5 }), 
          displayKey: 'title', 
          name: 'story', 
          templates: { 
           header: '<div class="aa-suggestions-category">Stories</div>', 
           suggestion: function(suggestion) { 
            return '<img src="/images/article/' + suggestion.id + '_100.jpg">' + '<div><span>' + 
             suggestion._highlightResult.title.value + '</span><span>' + 
             suggestion._highlightResult.author_name.value + '</span></div>'; 
           }, 
           empty: '<div class="aa-empty">No results. See <a href="/stories">all stories</a></div>', 
          } 
         } 

       ]).on('autocomplete:empty', function() { 
        document.getElementById('see-all-sr').style.display = "none"; 
       }); 

ответ

0

К сожалению, наборы данных autocomplete.js игровых/источники являются независимыми и асинхронным ... поэтому такими условия футера не очень осуществимые:/

Это потребует более глубокую перезапись.

+0

Спасибо. Использование параллельного запроса для получения количества обращений см. Ниже. Но 'c' не определено. Вы можете помочь? var client = algoliasearch (...); var in = client.initIndex ('c'); $ ('# search'). Change (function() { var st = $ (this) .val(); in.search (st, function searchDone (err, content) { if (err) { с = 0; } Else { с = content.nbHits; \t \t \t \t} }); оповещения (с);. – user6122500

+0

Помните, что обратные вызовы будут называться асинхронно Вы не можете использовать такой код для отображения/предупредить значение -> вам нужно сделать его более совместимым с JavaScript. – redox