Tengo un cuadro de búsqueda en mi aplicación donde los usuarios pueden buscar los detalles de un paciente almacenados en la base de datos. escribirían el nombre del paciente y el servidor responderá con la respuesta JSON con todos los detalles. Para facilitar dicha funcionalidad, estoy usando la última versión typeahead.js.

Aquí está mi código javascript:

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

Este código me da la siguiente respuesta JSON:

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

Cuando la biblioteca typeahead intenta generar esta respuesta, siempre veo indefinido en la lista desplegable. Quiero mostrar todos los campos de esta respuesta en la lista desplegable de sugerencias automáticas. Apreciaría si alguien pudiera guiarme para hacerlo.

Quiero mostrar un registro como este en la lista desplegable:

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

¡Gracias por adelantado!