阿尔及利亚自动填充多个索引,全局为空

时间:2018-08-17 18:49:02

标签: javascript autocomplete algolia

在遵循此tutorial之后,如何在没有结果的情况下向用户显示。该页面的当前示例无法解决此问题。

在我当前的工作集中,我的工作正常,但是“未找到结果”消息适用于所有不匹配的索引。当所有索引的搜索均返回零结果时,我希望有一个响应。

可以找到here实用的JSFiddle。

var client = algoliasearch('9G2RUKPPGE', '8860a74c330efaf0119818fcdd800126');
var SPR     = client.initIndex('dev-SPR');
var SWG_SPR = client.initIndex('dev-SWG_SPR');

//initialize autocomplete on search input (ID selector must match)
$('#aa-search-input').autocomplete(
    { 
        hint: false,
        debug: true
    }, 
    [{
        source: $.fn.autocomplete.sources.hits(SPR, {
            hitsPerPage: 10
        }),
        displayKey: 'name',
        templates: {
                header: 'Spacers',
                suggestion: function(suggestion) {
                    return showSuggestions(suggestion); 
            }
        }
    },
    {
        source: $.fn.autocomplete.sources.hits(SWG_SPR, {
            hitsPerPage: 10
        }),
        displayKey: 'name',
        templates: {
                header: 'Swage Spacers',
                suggestion: function(suggestion) {
                   return showSuggestions(suggestion); 
            }
        }
    }
]).on('autocomplete:selected', function(event, suggestion, dataset) {
    window.location.href = window.location.origin + '/' + suggestion.url
});

function showSuggestions(suggestion) {
const markup = `
                    <div class="row">
                        <div class="col-xs-1 col-sm-1 col-md-1 nopadding">
                            <img src="${suggestion.image}" alt="" class="algolia-thumb">
                        </div>
                        <div class="col-xs-11 col-sm-11 col-md-11">
                            <div class="row">
                                <div class="col-xs-6 col-sm-8 col-md-8">
                                    <span>${suggestion._highlightResult.code.value}</span>
                                </div>
                                <div class="col-xs-6 col-sm-4 col-md-4">
                                    <span>Available Qty: ${suggestion.quantityAvailable.toLocaleString()}</span>
                                </div>
                            </div>
                            <div class="row hidden-xs">
                                <div class="col">
                                    <span>${suggestion.description}</span>
                                </div>
                            </div>
                        </div>
                    </div>`;

                return '<div class="algolia-result">' + markup + '</div>';
}

0 个答案:

没有答案