He puesto un campo de texto donde yo escribo y me muestra algunas sugerencias de atocompletar tomandolas desde una base de datos, ahora necesito que cuando seleccione una de las opciones me llene una tabla que aparece abajo.
El problema que estoy teniendo es que si en el campo de texto voy escribiendo "OPCI" me sale las sugerencias y selecciono "OPCION_1" me sale abajo la tabla, pero solo con las cabeceras, no m,e sale ninguna informacion, ya que el dato que se está enviando al php donde hago la consulta a la base de datos es "OPCI" (lo que escribí) y no "OPCION_1" que es lo que seleccioné de las sugerencias.
Que hago????
Aca les adjunto el codigo que estoy utilizando en el html
Código HTML:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Prueba de Auto Suggest y mostrar tabla</title> <script type="text/javascript" src="jquery-1.2.1.pack.js"></script> <script type="text/javascript"> function lookup(inputString) { if(inputString.length == 0) { // Hide the suggestion box. $('#suggestions').hide(); } else { $.post("rpc.php", {queryString: ""+inputString+""}, function(data){ if(data.length >0) { $('#suggestions').show(); $('#autoSuggestionsList').html(data); } }); } } // lookup function fill(thisValue) { $('#inputString').val(thisValue); setTimeout("$('#suggestions').hide();", 200); } </script> <script type="text/javascript"> function showUser(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getuser.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <div> <form> <div> Ingrese el texto aca: <br /> <input type="text" size="30" value="" id="inputString" onkeyup="lookup(this.value);" onblur="fill();" onchange="showUser(this.value)"/> </div> <div class="suggestionsBox" id="suggestions" style="display: none;"> <img src="upArrow.png" style="position: relative; top: -12px; left: 30px;" alt="upArrow" /> <div class="suggestionList" id="autoSuggestionsList"> </div> </div> </form> </div> <a>Hola</a> <div id="txtHint"><b>La tabla se va a mostrar aca.</b></div> </body> </html>