Hola a todos!
Tengo un problema con un autocompletador que estoy utilizando en un desarrollo. Es algo sencillo, una caja de texto donde según vas pulsando letras, va realizando la búsqueda de clientes en una tabla, mediante Ajax, y esta es mostrada para que el usuario pueda seleccionar la que esté buscando, vamos algo normal.
El problema que tengo es que va muy lento, y si pulso rápidamente varias teclas seguidas, ya no se ejecuta el evento onkeyup que hace la llamada del ajax.
No se si hay alguna forma de que no pase esto, o alguna forma de mejorar el código.
Os dejo el código que se utiliza.
Código:
<input type="text" class="cuadro_busqueda" name="buscador_clientes" id="buscador_clientes" size="85" onkeyup="searchPaciente(1,{$session.profesional1},0,{$session.turno});" autocomplete="off"/>
JAVASCRIPT
Código:
function handleHttpResponseBuscarPacientes() {
if (http.readyState == 4) {
if (http.responseText.indexOf('invalid') == -1) {
var response = http.responseXML;
if ($('search_paciente')){
$('search_paciente').innerHTML = response.getElementsByTagName('data').item(0).firstChild.data;
}
isWorking = false;
}
}
}
var isWorking = false;
function searchPaciente(numConsultas,id_doctor1,id_doctor2,turno){
var texto = document.getElementById("buscador_clientes").value;
if(texto.length > 3){
http = new XMLHttpRequest();
if (!isWorking && http)
{
var texto = document.getElementById("buscador_clientes").value;
var url = "../ajax/searchPaciente.php?texto="+texto+"&numConsultas="+numConsultas+"&id_doctor1="+id_doctor1+"&id_doctor2="+id_doctor2+"&turno="+turno;
http.open("GET", url, true);
http.onreadystatechange = handleHttpResponseBuscarPacientes;
isWorking = true;
http.send(null);
}
}else{
$('search_paciente').innerHTML = '';
}
}
Por último el PHP
Código:
function Conectarse()
{
require_once('../inc/config.inc.php');
if (!($link=mysql_connect($default_host,$default_login,$default_password)))
{
echo "Error conectando a la base de datos.";
exit();
}
if (!mysql_select_db($default_database,$link))
{
echo "Error seleccionando la base de datos.";
exit();
}
return $link;
}
$link=Conectarse();
require_once('../inc/config.inc.php');
if(isset($_GET['texto']) && strlen($_GET['texto']) > 3){
$sql = "SELECT p.id_patients, p.name as nombre, p.surname, p.dni, i.name as compania FROM cv_patients as p, cv_insurance as i WHERE (p.name LIKE '%".$_GET['texto']."%' OR p.surname LIKE '".$_GET['texto']."%' OR p.dni LIKE '%".$_GET['texto']."%') AND i.id_insurance=p.id_insurance";
$query=mysql_query($sql,$link);
$pacientes = array();
while ($row=mysql_fetch_array($query)){
$pacientes[] = $row;
}
}
$result = '';
$result .= '<div style="float: left; width: 90%; padding: 2% 5%;">';
$result .= '<div id="cerrar">';
$result .= '<a href="#" onclick="cerrarCuadroBusqueda();"><img src="/templates/default/imgs/cerrar.gif" border="0"/></a>';
$result .= '</div>';
if(count($pacientes)>0){
foreach($pacientes as $paciente){
$result .= '<div id="cliente_busqueda_'.$paciente['id_patients'].'" style="float: left; width: 100%;" onMouseOver="cambiar_color_fondo('.$paciente['id_patients'].')" onMouseOut="restablecer_color_fondo('.$paciente['id_patients'].')">';
$result .= '<div id="nombre" style="float:left; width: 40%;">';
$result .= $paciente['nombre'].' '.$paciente['surname'];
$result .= '</div>';
$result .= '<div id="dni" style="float:left; width: 15%;">';
$result .= $paciente['dni'];
$result .= '</div>';
$result .= '<div id="aseguradora" style="float:left; width: 25%;">';
$result .= $paciente['compania'];
$result .= '</div>';
$result .= '<div id="cita">';
$result .= '<a href="/?op=asignar_consulta&id_paciente='.$paciente['id_patients'].'&id_doctor='.$_GET['id_doctor1'].'&id_consulta=1&estado=1&turno='.$_GET['turno'].'">Consulta 1</a>';
$result .= '</div>';
if($_GET['numConsultas']==2){
$result .= '<div id="cita2">';
$result .= '<a href="/?op=asignar_consulta&id_paciente='.$paciente['id_patients'].'&id_doctor='.$_GET['id_doctor2'].'&id_consulta=2&estado=1&turno='.$_GET['turno'].'">Consulta 2</a>';
$result .= '</div>';
}
$result .= '</div>';
}
}else{
if(strlen($_GET['texto']) > 3)
$result .= 'NO SE HA ENCONTRADO NINGÚN PACIENTE. <a href="/?op=patients&action=insert" style="color: #1D78D5; font: normal normal 12px Arial;">PULSE AQUÍ PARA DARLO DE ALTA</a>';
}
$result .= '</div>';
$return_value = '<?xml version="1.0" encoding="ISO-8859-1" standalone="yes"?><response>';
$return_value .= '<data><![CDATA[' . $result . ']]></data>';
$return_value .= '</response>';
header('Content-Type: text/xml');
echo $return_value;
En local funciona bien, pero es al subirlo a producción cuando va muy lento.
Cualquier aportación será bienvenida. Gracias