javascript - Twitter Typeahead 返回结果的完整对象

Question

我在使用 twitter typeahead 和 C# MVC 时遇到问题，当它自动完成时，它会将整个对象打印到我的输入中:

我的代码:

var states = [];

@foreach (var item in ViewBag.Clubes)
{
    @:states.push({ "Nome" : "@item.Nome", "Id" : "@item.Id" })
}


$('.typeahead').typeahead({
    hint: true,
    highlight: true,
    minLength: 1,
    valueKey: 'Nome',
    displayKey: 'Nome'
},
{
    name: 'value',
    source: substringMatcher(states),
    templates: {

    empty: [
      '<div class="empty-message">',
        ' Clube não encontrado ',
      '</div>'
    ].join('\n'),
    suggestion: function (data) {
        return "<strong>" + data.Nome + " " + data.Id + "</strong>";
    }

}
});

下拉建议中的值工作正常，但是当我选择它们时，他用数组对象填充输入，有人知道我该如何解决它吗？

谢谢。

Answer 1

只需为预输入输入框设置一个值，如下所示

$('.typeahead').typeahead('val',data.Nome);

这是您的最终代码

var states = [];

@foreach (var item in ViewBag.Clubes)
{
    @:states.push({ "Nome" : "@item.Nome", "Id" : "@item.Id" })
}


$('.typeahead').typeahead({
    hint: true,
    highlight: true,
    minLength: 1,
    valueKey: 'Nome',
    displayKey: 'Nome'
},
{
    name: 'value',
    source: substringMatcher(states),
    templates: {

    empty: [
      '<div class="empty-message">',
        ' Clube não encontrado ',
      '</div>'
    ].join('\n'),
    suggestion: function (data) {
        return "<strong>" + data.Nome + " " + data.Id + "</strong>";
    }

}
}).on('typeahead:selected', function(e, data) {
        $('.typeahead').typeahead('val',data.Nome);
});