este codigo lo encontre en una web y lo quise tratar de modificar para que cargara los datos de una bd pero pues no me funciona y no se porque haber si alguien puede ayudarme
aqui esta el codigo php
Código PHP:
<?php
include("../config.php");
$sql="SELECT carrera FROM egresados";
$res=mysql_query($sql);
while($row=mysql_fetch_array($res))
{
$datos[count($datos)]=$row["carrera"];
echo $datos;
}
$texto = $_GET["texto"];
// Devuelvo el XML con la palabra que mostramos (con los '_') y si hay éxito o no
$xml = '<?xml version="1.0" standalone="yes"?>';
$xml .= '<datos>';
foreach ($datos as $dato) {
if (strpos(strtoupper($dato), strtoupper($texto)) === 0 OR $texto == "") {
$xml .= '<pais>'.$dato.'</pais>';
}
}
$xml .= '</datos>';
header('Content-type: text/xml');
echo $xml;
?>
Código HTML:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "xhtml1-transitional.dtd"> <html> <head> <title>Sentido Web - AJAX</title> <style type="text/css"> div.contenedor { position: relative; width: 100px; } input { font-family: Arial; color: #008585; font-size: 8pt; border: 1px solid #008585; padding-left: 3px; width: 130px; } div.fill { font-family: Arial; font-size: 8pt; display: none; width: 128px; position:absolute; color: #E0EBEB; background-color: #E0EBEB; border: 1px solid #008585; overflow: auto; height: 150px; top: -1px; } tr.fill { font-family: Arial; font-size: 8pt; color: #E0EBEB; background-color: #008585; border: 1px solid #008585; } tr { font-family: Arial; font-size: 8pt; background-color: #E0EBEB; color: #008585; border: 1px solid #E0EBEB; } </style> <script type="text/javascript"> var IE = navigator.appName.toLowerCase().indexOf("microsoft") > -1; var Mozilla = navigator.appName.toLowerCase().indexOf("netscape") > -1; var textoAnt = ""; var posicionListaFilling = 0; var datos = new Array(); function ajaxobj() { try { _ajaxobj = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { _ajaxobj = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { _ajaxobj = false; } } if (!_ajaxobj && typeof XMLHttpRequest!='undefined') { _ajaxobj = new XMLHttpRequest(); } return _ajaxobj; } function cargaLista(evt, obj, txt) { ajax = ajaxobj(); ajax.open("GET", "paises.php?texto="+txt, true); ajax.onreadystatechange=function() { if (ajax.readyState==4) { var datos = ajax.responseXML; var paises = datos.getElementsByTagName("pais"); var listaPaises = new Array(); if (paises) { for (var i=0; i<paises.length; i++) { listaPaises[listaPaises.length] = paises[i].firstChild.data; } } escribeLista(obj, listaPaises); } } ajax.send(null); } function escribeLista(obj, lista) { var html = ""; var fill = document.getElementById('lista'); if (lista.length == 0) { // Si la lista es vacia no la mostramos fill.style.display = "none"; } else { // Creamos una tabla con // todos los elementos encontrados fill.style.display = "block"; var html='<table cellspacing="0" '+ 'cellpadding="0" border="0" width="100%">'; for (var i=0; i<lista.length; i++) { html += '<tr id="tr'+obj.id+i+ '" '+(posicionListaFilling == i? ' class="fill" ': '')+ ' onmouseover="seleccionaFilling(\'tr'+ obj.id+'\', '+i+ ')" onmousedown="seleccionaTextoFilling(\'tr'+ obj.id+'\', '+i+')">'; html += '<td>'+lista[i]+'</td></tr>'; } html += '</table>'; } // Escribimos la lista fill.innerHTML = html; } // Muestra las coincidencias en la lista function inputFilling(evt, obj) { var fill = document.getElementById('lista'); var elems = datos; var tecla = ""; var lista = new Array(); var res = obj.value; var borrar = false; // Almaceno la tecla pulsada if (!IE) { tecla = evt.which; } else { tecla = evt.keyCode; } var texto; // Si la tecla que pulso es una // letra o un espacio, o el intro // o la tecla borrar, almaceno lo // que debo buscar if (!String.fromCharCode(tecla).match(/(\w|\s)/) && tecla != 8 && tecla != 13) { texto = textoAnt; } else { texto = obj.value; } textoAnt = texto; // Si el texto es distinto de vacio // o se pulsa ARRIBA o ABAJO // hago llamada AJAX para que // me devuelva la lista de palabras // que coinciden con lo que hay // escrito en la caja if ((texto != null && texto != "") || (tecla == 40 || tecla == 38)) { cargaLista(evt, obj, texto); } // Según la letra que se pulse if (tecla == 37) { // Izquierda // No hago nada } else if (tecla == 38) { // Arriba // Subo la posicion en la // lista desplegable una posición if (posicionListaFilling > 0) { posicionListaFilling--; } // Corrijo la posición del scroll fill.scrollTop = posicionListaFilling*14; } else if (tecla == 39) { // Derecha // No hago nada } else if (tecla == 40) { // Abajo if (obj.value != "") { // Si no es la última palabra // de la lista if (posicionListaFilling < lista.length-1) { // Corrijo el scroll fill.scrollTop = posicionListaFilling*14; // Bajo la posición de la lista posicionListaFilling++; } } } else if (tecla == 8) { // Borrar <- // Se sube la lista del todo posicionListaFilling = 0; // Se permite borrar borrar = true; } else if (tecla == 13) { // Intro // Deseleccionamos el texto if (obj.createTextRange) { var r = obj.createTextRange(); r.moveStart("character", obj.value.length+1); r.moveEnd("character", obj.value.length+1); r.select(); } else if (obj.setSelectionRange) { obj.setSelectionRange( obj.value.length+1, obj.value.length+1); } // Ocultamos la lista fill.style.display = "none"; // Ponemos el puntero de // la lista arriba del todo posicionListaFilling = 0; // Controlamos el scroll fill.scrollTop = 0; return true; } else { // En otro caso que siga // escribiendo posicionListaFilling = 0; fill.scrollTop = 0; } // Si no se ha borrado if (!borrar) { if (lista.length != 0) { // Seleccionamos la parte del texto // que corresponde a lo que aparece // en la primera posición de la lista // menos el texto que realmente hemos // escrito obj.value = lista[posicionListaFilling]; if (obj.createTextRange) { var r = obj.createTextRange(); r.moveStart("character", texto.length); r.moveEnd("character", lista[posicionListaFilling].length); r.select(); } else if (obj.setSelectionRange) { obj.setSelectionRange( texto.length, lista[posicionListaFilling].length); } } } return true; } // Introduce el texto seleccionado function setInput(obj, fill) { obj.value = textoAnt; fill.style.display = "none"; posicionListaFilling = 0; } // Cambia el estilo de // la palabra seleccionada // de la lista function seleccionaFilling(id, n) { document.getElementById(id + n).className = "fill"; document.getElementById(id + posicionListaFilling).className = ""; posicionListaFilling = n; } // Pasa el texto del filling a la caja function seleccionaTextoFilling (id, n) { textoAnt = document.getElementById(id + n).firstChild.innerHTML; posicionListaFilling = 0; } // Cambia la imagen cuando se pone // encima el raton (nombre.ext // por _nombre.ext) function cambiarImagen(obj, ok) { var marcada = obj.src.indexOf("/_") > 0; if (ok) { if (!marcada) { var ruta = obj.src.substring( 0, obj.src.lastIndexOf("/")+1)+ "_"+obj.src.substring( obj.src.lastIndexOf("/")+1); obj.src = ruta; } } else { if (marcada) { var ruta = ""+obj.src.substring( 0, obj.src.lastIndexOf("_"))+ obj.src.substring( obj.src.lastIndexOf("/")+2); obj.src = ruta; } } } </script> </head> <body> <div> <input type="text" id="input-fill" autocomplete="off" onkeyup="inputFilling(event, this)" onblur="setInput(this, document.getElementById('lista'))"> <img src="abajo.gif" border="0" onmouseover="cambiarImagen(this, true)" onmouseout="cambiarImagen(this, false)" class="boton" onclick="cargaLista(event, document.getElementById('input-fill'), '')" alt="Mostrar" /> <div class="contenedor"><div id="lista" class="fill"></div></div> </div> </div> </body> </html>