Question

我已设置预先输入以返回搜索结果。结果正确返回，但是能够按下向上和向下按钮循环搜索结果，自动完成文本框的预期功能不起作用。我无法弄清楚原因。

var items = [{"Name":"TestAccount", "AccountID":"TestID"},{"Name":"TestAccount2", "AccountID":"TestID2"}]  



var templ = Hogan.compile('<div class="search-result"><a href="/Account/Edit/{{AccountID}}">{{Name}}</a></div>');
        var myTA = $('.js-header-search-box').typeahead({
            hint: true,
            highlight: true,
            minLength: 1
        }, {
            name: "Accounts",
            valueKey: "AccountID",
            engine: Hogan,
            templates: {
                empty: [
                  '<div class="empty-message">',
                  'unable to find any items that match the current query',
                  '</div>'
                ].join('\n'),
                suggestion: function (data) { return templ.render(data); }
            },
            source: function (query, process) { process(items);
                }
              
            
        });

        myTA.on('typeahead:selected', function (obj, datum) {
            var id = datum['AccountID'];
            document.location.href = area + '/Account/Edit' + id + '/';
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script src="http://twitter.github.io/hogan.js/builds/3.0.1/hogan-3.0.1.js"></script>
<script src="https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script>

<input autocomplete="off" class="js-header-search-box header-search-box" placeholder="Account name or postcode" type="text" >

Answer 1

您需要使用displayKey。像下面的东西

displayKey: function(accnt){
  return accnt.Name;
}

displayKey - 对于给定的建议对象，确定它的字符串表示形式。在选择建议后设置输入控件的值时将使用此选项。可以是键字符串，也可以是将建议对象转换为字符串的函数。默认为值。

Here is the reference

这是 DEMO

keybind向下滚动建议不起作用

1 个答案: