Twitter TypeAhead.js не обновляет ввод

Question

Я использую библиотеку Twitter's TypeAhead.js на моем проекте bootstrap 3. Кажется, что это отлично, однако у меня возникают проблемы с моим полем ввода. Как только я начну заполнять это, typeahead запускается, и появляется окно с предложением. Однако после выбора любой из записей поле ввода не заполняется вообще. Может кто-то мне помочь, пожалуйста?

Вот код, я работаю в настоящее время:

HTML:

<input type="text" class="form-control typeahead" name="txtCliente" id="txtCliente" placeholder="Cliente ou Aterro de Destino" value="" maxlength="100" required> 

код Javascript - активировать поле:

$('.typeahead').typeahead({ 
    name: 'parceiro', 
    remote: '../api/index.php/parceiro/busca/%QUERY', 
    template: [                 
    '<p>{{RAZAO_SOCIAL}}</p>',        
    '<p>{{DESCRICAO_TIPOPARCEIRO}}</p>',          
    '<p>{{CNPJ}}</p>'       
    ].join(''),                 
    engine: Hogan 
}); 

И, наконец, JSON возвращается с сервера:

[{ 
    "ID":"17", 
    "TIPOPARCEIRO":"C", 
    "DESCRICAO_TIPOPARCEIRO":"CLIENTE", 
    "RAZAO_SOCIAL":"VINICIUS SOARES BATISTA", 
    "CNPJ":"12344123213123" 
}] 

Заранее благодарен!

[EDIT]

Благодаря @ бас-jobsen, я был в состоянии развернуть это. Секрет, как заявил он, находится на функции (), предоставляемой TypeAhead. Bellow - это письменный код для такой функции.

...

$('#txtCliente').typeahead({         
    header: '<b>Clientes</b>', 
    template: [ 
    '<span>{{RAZAO_SOCIAL}}<BR>{{CNPJ}}</span>', 
    ].join(''), 
    limit: 3, 
    remote: { 
    url: '../api/index.php/parceiro/busca/%QUERY', 
    filter: function(parsedResponse) { 
     var dataset = []; 
     for(i = 0; i < parsedResponse.length; i++) { 
     if(parsedResponse[i].TIPOPARCEIRO == "C" || parsedResponse[i].TIPOPARCEIRO == "A"){ 
     dataset.push({ 
      ID: parsedResponse[i].ID, 
      RAZAO_SOCIAL: parsedResponse[i].RAZAO_SOCIAL, 
      DESCRICAO_TIPOPARCEIRO: parsedResponse[i].DESCRICAO_TIPOPARCEIRO, 
      CNPJ: parsedResponse[i].CNPJ, 
      value: parsedResponse[i].RAZAO_SOCIAL 
     }); 
     } 
     } 
     return dataset; 
    }, 
    }, 
    engine: Hogan 
}) 

...

Answer 1

Ваш набор данных не имеют свойство значения (также свойство лексемы отсутствует).

Из документов:

Отдельные блоки, составляющие наборы данных называются датумами. Каноническая форма базы данных представляет собой объект с размером и свойство токенов . value - это строка, представляющая базовое значение данных, а токены - это набор строк с одним словом , которые помогают typeahead.js в сопоставлении данных с заданным запросом.

Также обратите внимание на пример «Проекты с открытым исходным кодом на Twitter» на http://twitter.github.io/typeahead.js/examples/. JSON возвращение здесь массив объектов, таких как:

{ 
    "name": "typeahead.js", 
    "description": "A fast and fully-featured autocomplete library", 
    "language": "JavaScript", 
    "value": "typeahead.js", 
    "tokens": [ 
     "typeahead.js", 
     "JavaScript" 
    ] 
    } 

Если вы не можете изменить свой ответ в формате JSON можно использовать параметр фильтра дистанционного управления для построения достоверные данные:

$('.typeahead').typeahead({         
    name: 'is',          
    remote: {url:'database2.php?q=%QUERY', filter: function(data){ 

    for (var i = 0; i < data.length; i++) { 

     data[i].value = data[i].RAZAO_SOCIAL; 
     data[i].tokens = new Array(data[i].RAZAO_SOCIAL,data[i].DESCRICAO_TIPOPARCEIRO); 
    } 
    return data;} 

    }, 
    template: [ 
    '<p>{{RAZAO_SOCIAL}}</p>',        
    '<p>{{DESCRICAO_TIPOPARCEIRO}}</p>',          
    '<p>{{CNPJ}}</p>'    
    ].join(''), 
    filter: 'testfilter',                 
    engine: Hogan                 
});