Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Problemas de lentitud al crear un autocompletador con ajax y php

Estas en el tema de Problemas de lentitud al crear un autocompletador con ajax y php en el foro de Frameworks JS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 01/02/2011, 10:08
 
Fecha de Ingreso: febrero-2011
Ubicación: Ciudad Real
Mensajes: 5
Antigüedad: 13 años, 10 meses
Puntos: 0
Problemas de lentitud al crear un autocompletador con ajax y php

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

Etiquetas: ajax, autocompletador, javascript, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 14:51.