Ich habe ein Suchfeld in meiner Anwendung, in dem Benutzer nach Patientendaten suchen können, die in der Datenbank gespeichert sind. Sie geben den Namen des Patienten ein und der Server antwortet mit einer JSON-Antwort mit allen Details. Um diese Funktionalität zu ermöglichen, verwende ich die neueste Version typeahead.js.

Hier ist mein Javascript-Code:

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

Dieser Code gibt mir folgende JSON-Antwort:

[
 {
  "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"
 }
]

Wenn typeahead library versucht, diese Antwort zu rendern, wird in der Dropdown-Liste immer undefiniert angezeigt. Ich möchte alle Felder dieser Antwort in der Dropdown-Liste für automatische Vorschläge anzeigen. Ich würde mich freuen, wenn mich jemand dabei anleiten könnte.

Ich möchte einen Datensatz wie diesen in der Dropdown-Liste anzeigen:

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

Danke im Voraus!