Hola, yo encontre un buscador en internet que busca en una base de datos y muestra los resultados de forma automática:
Index.php
Código PHP:
Ver original<head>
<style>
b{color:blue;}
</style>
<style>
#myDiv
{
margin-top: 10px;
border-style:dashed;
width: 954px;
height: auto;
text-align: left;
color:#000;
padding:10px 10px;
border-radius:0 0 20px 20px;
}
#myDiv > a {
color:#000;
}
#prod-busq{
margin-top:0px;
width:100%;
height:460px;
display:inline-block;
}
#bus{
background-image:url(input.png);
padding-left:40px;
padding-top:10px;
padding-bottom:10px;
border:solid 1px #33FF33;
border-radius:5px;
width:700px;
height:30px;
font-size:26px;
}
#bus:focus{
box-shadow:0 0 15px #00FF00;
}
</style><script type="text/javascript" src="ajax.js"></script>
</head>
<body>
<div style="min-height:700px;">
<h1><b style="color:#000; font-family:Allan, cursive; font-size:60px;">Busqueda personalizada:</b></h1>
<input type="text" id="bus" name="bus" onkeyup="loadXMLDoc()" required />
<div id="myDiv" style="min-height:700px;">
</body>
proc.php
Código PHP:
Ver original<?php
include 'conexion.php';
$q=$_POST['q'];
$con=conexion();
$sql="select * from productos where clase LIKE '".$q."%' or titulo LIKE '".$q."%'";
echo '<b>No hay sugerencias</b>';
}else{
echo '<h2 style=" text-decoration:underline;font-family:Allan;">Resultados de la búsqueda</h2><br />';
echo'
<div id="prod-busq" style="display:inline-block;"> <h3>Nombre:'.$fila['titulo'].'</h3> <h3>Clase:'.$fila['clase'].'</h3> <p> <b><i><u>Colores disponibles=</u></i></b> '.$fila['color-1'].', '.$fila['color-2'].', '.$fila['color-3'].', '.$fila['color-4'].' ----- <b><i><u>Tamaño=</u></i></b> '.$fila['tamano'].'</p> <a href="http://www.forosdelweb.com/f18/Productos/ver.php?Prod='.$fila['prod-id'].'" rel="facebox[.bolder]">Ver el producto</a> <br/><img src="http://www.forosdelweb.com/f18/productos/imagenes/'.$fila['prod-id'].'.jpg" width="130px" height="160px" style="display: inline-block; border: #000 5px double;"/> <hr width="75%"> <hr width="50%"> <hr width="25%"> <hr width="12%"><br /> <br /> <br />
';
}
}
?>
ajax.js
Código Javascript
:
Ver originalfunction loadXMLDoc()
{
var xmlhttp;
var n=document.getElementById('bus').value;
if(n==''){
document.getElementById("myDiv").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("myDiv").innerHTML=xmlhttp.responseText;
}else{ document.getElementById("myDiv").innerHTML='<img src="load.gif" width="50" height="50" />'; }
}
xmlhttp.open("POST","proc.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("q="+n);
}
conexion.php
Código PHP:
Ver original<?php
function conexion(){
if (!$con){
}
return($con);
}
?>