Нижний колонтитул Global Typeahead и раздел «Нет совпадений»

Я использую несколько удаленных наборов данных для получения данных для плагина Typeahead. Все работает нормально.

Теперь я пытаюсь достичь 2 вещей

  1. Если все удаленные наборы данных не извлекают никаких результатов, должно отображаться «Результаты не найдены». Это не должно показывать, есть ли данные у какого-либо 1 удаленного источника.

  2. Я хочу показать статическую ссылку в нижнем колонтитуле контейнера typeahead, если есть результаты. Как я могу показать ссылку в нижнем колонтитуле?

Как я могу этого добиться? Я не уверен, что делать дальше.

Существуют примеры отображения нижнего колонтитула для каждого раздела, а не для всего контейнера с использованием класса «пустой» и «нижний колонтитул». Но они находятся на уровне набора данных, а не глобально.

Ссылка: https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md#datasets

Другие вопросы SO, подобные этому:

Глобальный нижний колонтитул в раскрывающемся списке typeahead

var nbaTeams = new Bloodhound({
   datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.value); },
   queryTokenizer: Bloodhound.tokenizers.whitespace,
   remote: '../data/nba.json'
});

var nhlTeams = new Bloodhound({
datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.value); },
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: '../data/nhl.json'
});

nbaTeams.initialize();
nhlTeams.initialize();

$('#multiple-datasets .typeahead').typeahead({
    highlight: true
},
{
  name: 'nba-teams',
  displayKey: 'team',
  source: nbaTeams.ttAdapter(),
  templates: {
    header: '<h3 class="league-name">NBA Teams</h3>'
  }
},
{
  name: 'nhl-teams',
  displayKey: 'team',
  source: nhlTeams.ttAdapter(),
  templates: {
    header: '<h3 class="league-name">NHL Teams</h3>'
  }
});

jquery typeahead.js twitter-typeahead
person Purus    schedule 30.03.2014    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Ты можешь сделать

$('.typeahed').typeahed(null, {
    name: 'suggestions',
    templates: {
        footer: Handlebars.compile('Results for {{ query }}'),
        empty: Handlebars.compile('<strong>Not Results for found.</strong>')

    }
});
person poramo    schedule 21.08.2014
comment
У вас есть jsfiddle, иллюстрирующий, как это связано с кодом Purus, связанным с вопросом? - person Phil; 23.10.2014
comment
Я попытаюсь добавить jsfiddle. Во всяком случае, я заставляю его работать по ссылке - person poramo; 04.11.2014
comment
Я не вижу, где вы заставили это работать, по приведенной ссылке. Тип, который я вижу в ссылке, не дает сообщения, если результаты не найдены. - person Phil; 04.11.2014

arrow_upward
0
arrow_downward

В качестве альтернативы вы можете создать собственный прослушиватель и изменить атрибут ссылки href, когда typehead выполняет рендеринг. Например

$('.typeahead').bind('typeahead:render', function() {
        $('.typehead__show-all-link').attr('href', '/search?q='+ $('.tt-input').val());
    });

где .typehead — ваш ввод, .typehead__show-all-link — класс ссылки для отображения дополнительных результатов

person jsHate    schedule 02.09.2016