En son typeahead.js kitaplığını kullanarak JSON yanıtı nasıl oluşturulur

Question

Uygulamamda, kullanıcıların veritabanında saklanan hasta ayrıntılarını arayabilecekleri bir arama kutusu var. Hastanın adını yazacaklar ve sunucu tüm detaylarla JSON yanıtıyla geri dönecek. Bu işlevselliği kolaylaştırmak için, en yeni sürümü typeahead.js kullanıyorum.

typeahead kütüphane bu yanıtı işlemeye çalıştığı

[ 
{ 
    "id":1, 
    "surname":"Daniel", 
    "forename":"JOHN", 
    "address": 
      { 
       "id":23, 
       "houseNameOrNumber":"35", 
       "addressDetail":"Roman House", 
       "postCode":"NE1 2JS" 
      }, 
    "gender":"M", 
    "age":27, 
    "dateOfBirth":"25/08/1985" 
} 
] 

, hep açılır listesinden tanımsız bkz:

$("#search-box").typeahead({ 
    remote: 'searchPatient.do?q=%QUERY' 
}); 

Bu kod JSON yanıtı şu bana verir: Burada

benim javascript kodu . Otomatik önerme açılır listesindeki bu yanıtın tüm alanlarını göstermek istiyorum. Birisi bana bunu yaparken bana rehberlik edebilirse memnun olurum.

Ben açılır listedeki böyle rekor görüntülemek istiyorum: önceden

John Daniel (M, 27) 
35 Roman House, NE1 2JS 
25/08/1985 

Teşekkür! ,

$('#search-box').typeahead([{        
    name: 'Search', 
    valueKey: 'forename', 
    remote: { 
     url: 'searchPatient.do?q=%QUERY', 
     filter: function (parsedResponse) { 
      // parsedResponse is the array returned from your backend 
      console.log(parsedResponse); 

      // do whatever processing you need here 
      return parsedResponse; 
     } 
    },            
    template: [                 
     '<p class="name">{{forename}} {{surname}} ({{gender}} {{age}})</p>', 
     '<p class="dob">{{dateOfBirth}}</p>' 
    ].join(''),                 
    engine: Hogan // download and include http://twitter.github.io/hogan.js/                
}]); 

Sadece size temel fikir vermek için yardımcı olur umarım:

Answer 1

Geçerli kod Bunu başarmak için çok basit, bunu başarmak için template ve remote kullanmak gerekir.