un buscador

[cchusann]

hola a todos estoy sufriendo con esto.....

suponiendo que tengo una tabla donde tengo mis productos...

quiero poner(Ejemplo)...

Productos: Cuadro de texto y el boton buscar

al momento de escribir la c en el cuadro de texto o de presionar el boton, quiero que me salgan todos los datos que tengan c o algo parecido a esto...

y que me presente la consulta en una tabla....

ya e buscado y no encuentro y lo q encuentro no sale...

si alguien me puede ayudar con eso....

muchas gracias por responder

[GatorV]

Hola cchusann,

¿Que tipo de Base de Datos estas utilizando?

Saludos.

[cchusann]

hola GatorV

estoy utilizando mysql....

[Taldreakan]

Por lo que entiendo quieres es que conforme vas tecleando la palabra se valla filtrando una lista de productos que tengas.

Lo que quieres hacer no esta tan facil.

Puedes hacerlo con una combinacion de PHP y AJAX

O tambienpodrias cargar todo tu catalogo de productos en un arreglo de Java y mediante funciones como indexOf hacer el filtro.

Yo una vez hice algo asi en JavaScript, pero tambien puede quedar con AJAX.

[cchusann]

y lo que hiciste si lo tienes...

y no tengo ni idea como se utiliza ajax....

[Taldreakan]

Como te dije es una combinacion de PHP y JavaScript.

Este es el codigo Hibrido (por llamarlo de alguna manera) JavaScript-PHP.

Código HTML:

<script>
    <?
                $cat_prod = 0;
		while ($row_fields = mysql_fetch_array($fields))
			{	
				if ($cat_prod <= 0)
					{
						echo "\ncat_nombre = new Array('" . $row_fields['txt_Producto'] . "');";
						echo "\ncat_codigo = new Array('" . $row_fields['num_Codigo'] . "');";
					}
				else
					{
						echo "\ncat_nombre[" . $cat_prod . "] = '" . $row_fields['txt_Producto'] . "';";
						echo "\ncat_codigo[" . $cat_prod . "] = '" . $row_fields['num_Codigo'] . "';";
					}
				$cat_prod++;
			}
    ?>
</script> 

Explico: Previo al ciclo While ya realizaste la consulta correspondiente.
Como vez dentro del codigo JS esta metido el codigo PHP, esto para poder crear los arreglos en JS.

[Ronruby]

Muy interesante O.O
¿Me pregunto si tienes un ejemplo de dicho codigo subido en algun sitio? Para verlo no mas.

[Taldreakan]

Ahora viene lo bueno.
Esto es solo codigo HTML y JS.

Código HTML:

 <form name="form1">

                <input name="codigo" type="text"class="textoNormal">
                <input name="inputname" type="text" class="textoNormal">

          <div align="center">
            <p class="textoNormal"> Nombre:
                <input name="buscanombre" type="text" id="buscanombre" onKeyPress="keyCode_Busca(event);" class="textoNormal">
                <script>
				function keyCode_Busca(event)
					{
						code = event.keyCode;
						if (code == 13)
							{
								event.keyCode=0;
								LlenaListaBusca();
								return false;
							}
						if (code == 27)
							{
					   			event.keyCode=0;			
								document.getElementById('busca').style.visibility = "hidden";
								document.form1.inputname.focus();
								document.form1.inputname.select();
							}
					}
	
				function LlenaListaBusca()
					{
					    VaciaListaBusca();
					    var myListBox=document.form1.lista;
						
						nom_bus = document.form1.buscanombre.value.toUpperCase();
					    for (i=0; i<cat_prod; i++)
						    {
								nom_aux = cat_nombre[i].toUpperCase();								
								if (nom_aux.indexOf(nom_bus) > -1)
									{
										myOption = new Option(cat_nombre[i], cat_codigo[i]);
								        optionPos = myListBox.options.length;
						        		myListBox.options[optionPos] = myOption;
									}
						    }
						document.form1.lista.focus();
						document.form1.lista.selectedIndex = 0;
					}

				function VaciaListaBusca()
					{
					    var myListBox=document.form1.lista

					    for (i=myListBox.length; i>=0; i--)
						    {
						        myListBox.options[i] = null;
						    }
					}
				
				function selectProd(event)
					{
						code = event.keyCode;
						if (code == 13)
							{								
								EligeProd();
								return false;
							}
						if (code == 27 || code == 13)
							{
					   			document.getElementById('busca').style.visibility = "hidden";
								event.keyCode=0;
								document.form1.inputname.focus();
								document.form1.inputname.select();
							}									
					}
					
				function EligeProd()
					{
						cad = document.form1.codigo.value;
						pos = cad.indexOf("*");
						if (pos > 0)
							{
								cad = cad.substring(0, pos+1);	// Cantidad de un producto
							}
						else
								cad = "";
						document.getElementById('busca').style.visibility = "hidden";
						document.form1.codigo.value = cad+document.form1.lista.options[form1.lista.selectedIndex].value;
						document.form1.inputname.value = document.form1.lista.options[form1.lista.selectedIndex].text;
						document.form1.inputname.focus();
					}
			</script>
            </p>
            <p>
              <select name="lista" size="10" onkeypress="selectProd(event);" ondblclick="EligeProd();" class="textoNormal">
                <option value="<?php echo 'num_Codigo'; ?>"><?php echo 'txt_Producto'; ?></option>
              </select>
            </p>
          </div>
      </form> 

Dentro de la capa (div) tengo dos elementos que son los que hacen todo el show: un Input text y un Select.

En el input es donde se teclea el nombre del producto.
El select es la lista que se llenara filtrando los productos por el contenido del input.

En mi caso no ocupo ningun boton de buscar, yo lo controlo con el evento onKeyPress y en el codigo Java cacho el codigo de la tecla Enter (13) para simular el boton de buscar.

Luego despues de que se vacia y se vuelve allenar el select, dentro de este tambien controlo la seleccion del producto con Enter o Doble Clic, el codigo de producto y el nombre los envio a dos input text (codigo, inputname)para darle el tratamiento que necesito.

[Taldreakan]

Espero haberme explicado y no haber olvidado ningun detalle, porque esto lo hice hace cuatro o cinco años.

[Taldreakan]

Iniciado por Ronruby

Muy interesante O.O
¿Me pregunto si tienes un ejemplo de dicho codigo subido en algun sitio? Para verlo no mas.

Esto lo hice para una aplicacion local, un punto de venta que esperabamos que se conectara a internet pero no hubo tal presupuesto y quedo como aplicacion.

Este mismo punto de venta se pudo ver desarrollado y estaria mejor en cualquier otro lenjuage de desarrollo cliente servidor (no para web).

Todo este choro es para responder a tu pregunta:
No, no esta en ningun servidor corriendo como aplicacion web, si bien esta instalado en algunas maquinas corriendo con un programa servidor como PHP-Triad o WAMP, pero ninguna drectamente sobre web.

Espero te sirva y puedas adaptarlo facil a tu aplicacion.