Ver Mensaje Individual
  #1 (permalink)  
Antiguo 22/03/2012, 23:04
Avatar de freesoftwarrior
freesoftwarrior
 
Fecha de Ingreso: marzo-2006
Mensajes: 362
Antigüedad: 18 años, 2 meses
Puntos: 10
Utilizar las teclas direccionales para seleccionar un item

Buenas noches:
Este es el panorama. Ojalá puedan ayudarme porque en verdad esto si ya escapa de mis conocimientos.

Tengo un clásico código en ajax de esos que muestran los resultados en un div según se va ingresando el dato a buscar. Por ejemplo, ingreso la letra A y aparecen todos los apellidos que empiezan con A, y si luego digito L pues filtra y me muestra los apellidos que empiezan con AL.

El código funciona bien. Para seleccionar el dato que se busca se usa el mouse. Sin embargo ahora me piden que se utilicen las teclas direccionales (las flechitas). Lo que se puede hacer en este momento es utilizar y navegar en la lista con la tecla TAB y seleccionar con ENTER.

¿Cómo puedo hacer esto?

Por si las dudas posteo el código que utilizo

Cita:
function nuevoAjax()
{
var xmlhttp=false;

try
{xmlhttp = new XMLHTTPRequest();}
catch(err1)
{
try
{xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");}
catch (err2)
{
try
{xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}
catch (err3)
{xmlhttp = false;}
}
}
return xmlhttp;
}



var xmlHttp

function showHint(str,n)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
document.getElementById("txtHint").style.visibilit y="hidden";
return;
}

xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Su navegador no soporta AJAX");
return;
}

var url="consultar.asp";


url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHt tp.responseText;
if(xmlHttp.responseText=="ND")
{document.getElementById("txtHint").style.visibili ty="hidden";}
else
{document.getElementById("txtHint").style.visibili ty="visible";}
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}
catch (e)
{xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}
}
return xmlHttp;
}

function selectItem(ruc,empresa,id)
{
document.getElementById("txt1").value=ruc;
document.getElementById("txtHint").style.visibilit y="hidden";
document.getElementById("txt1").value="";

document.registros.ruc.value=ruc;

icono(1);
}
El código de la página ASP me parece que no tiene nada que ver con mi consulta, pues simplemente realiza la consulta con la base de datos.

Este es el código que utilizo para invocar el Ajax

Cita:
<input type="text" ID="txt1" onKeyUp="showHint(this.value,1);">
<div id="txtHint" align="left"></div>
Reitero, ojalá puedan ayudarme porque en verdad esto si ya escapa de mis conocimientos.

Muchas muchas gracias por el apoyo.
Un saludo desde Lima, Perú