sql >> Base de Datos >  >> RDS >> Mysql

Twitter bootstrap typeahead devuelve múltiples valores y llena el cuadro de edición

Si lo entiendo correctamente, está obteniendo resultados pero no puede completar los campos de entrada. Aunque no uso Twitter Bootstrap typeahead, hago algo muy similar con la función de autocompletar de jQuery. El siguiente código no se ha probado y, por supuesto, deberá modificarlo usted mismo, pero con suerte será de alguna ayuda.

Vea este jsFiddle en funcionamiento demostración por algo similar.

PHP

$array = array();
while ($row = mysql_fetch_assoc($sql)) {
    array_push($array,array('ContactName'=>$row['ContactName'],'Telephone'=>$row['Telephone'],'Email'=>$row['Email']));
}
echo json_encode($array);


Puede comprobar lo que se devuelve introduciendo manualmente la URL (p. ej., susitio/Cliente.php?query=NombreDeAlgúnContacto). Deberías ver algo similar a esto:

[{"ContactName":"Some Contact","Telephone":"5555555555","Email":"[email protected]"},
 {"ContactName":"Some Other Contact","Telephone":"5555555555","Email":"[email protected]"}]


HTML/Javascript

<script>
    $('input.typeahead').typeahead({
        source: function (query, process) {
            $.ajax({
                url: 'Customer.php',
                type: 'POST',
                dataType: 'JSON',
                // data: 'query=' + query,
                data: 'query=' + $('#contactName').val(),
                success: function(data)
                {
                    var results = data.map(function(item) {
                        var someItem = { contactname: item.ContactName, telephone: item.Telephone, email: item.Email };
                        return JSON.stringify(someItem.contactname);
                    });
                    return process(results);
                }
            });
        },
        minLength: 1,
        updater: function(item) {
            // This may need some tweaks as it has not been tested
            var obj = JSON.parse(item);
            return item;
        }
    });
</script>

Aquí hay un par de otras publicaciones que tal vez quiera ver Cómo devolver la respuesta de un AJAX llamar? y Formato de resultado Bootstrap typeahead ajax - Ejemplo