I needed help in organizing the table that will be exposed. I wanted it to be a part up identifying the fields (once only). The fields are:
- ID
- VAGA
- WALK
- APARTMENT
- NAME
- MODEL
- COR
Here's my code:
mysql_connect("localhost","root","");
mysql_select_db("clientes");
$busca = $_GET['busca'];
if($busca != "") {
$sql = "SELECT * FROM clientes WHERE nVaga LIKE '%$busca%' ORDER BY nVaga ASC ";
$query = mysql_query($sql) or die( mysql_error() );
//variavel para zebrar as linhas
$cont = 0;
while($row = mysql_fetch_object($query)) {
//faz a diferenciação das cores para as linhas dos resultados
if($cont %2 ==0) {
$cor = "#EDEDED";
} else {
$cor = "#FFFFFF";
}
echo "<div style='background:$cor'>";
// Atribui o código HTML para montar uma tabela
$tabela = "<table border='1'>
<thead>
<tr>
<th>$row->id</th>
<th>$row->ap</th>
<th>$row->andar</th>
<th>$row->nomeDono</th>
<th>$row->modeloCarro</th>
<th>$row->cor</th>
</tr>
</thead>
<tr>";
echo $tabela;
$cont ++;
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>BUSCAR PELA VAGA</title>
<script>
//função para pegar o objeto ajax do navegador
function xmlhttp()
{
// XMLHttpRequest para firefox e outros navegadores
if (window.XMLHttpRequest)
{
return new XMLHttpRequest();
}
// ActiveXObject para navegadores microsoft
var versao = ['Microsoft.XMLHttp', 'Msxml2.XMLHttp', 'Msxml2.XMLHttp.6.0', 'Msxml2.XMLHttp.5.0', 'Msxml2.XMLHttp.4.0', 'Msxml2.XMLHttp.3.0','Msxml2.DOMDocument.3.0'];
for (var i = 0; i < versao.length; i++)
{
try
{
return new ActiveXObject(versao[i]);
}
catch(e)
{
alert("Seu navegador não possui recursos para o uso do AJAX!");
}
} // fecha for
return null;
} // fecha função xmlhttp
//função para fazer a requisição da página que efetuará a consulta no DB
function carregar(nome)
{
a = document.getElementById('busca').value;
var tp = document.forms[0].elements[nome];
for(i=0; i < tp.length; i++ ) {
if (tp[i].checked == true)
var t = tp[i].value;
}
ajax = xmlhttp();
if (ajax)
{
ajax.open('get','busca.php?busca='+a+'&tipo='+t, true);
ajax.onreadystatechange = trazconteudo;
ajax.send(null);
}
}
//função para incluir o conteúdo na pagina
function trazconteudo()
{
if (ajax.readyState==4)
{
if (ajax.status==200)
{
document.getElementById('resultados').innerHTML = ajax.responseText;
}
}
}
</script>
</head>
<body>
<form id="form1" action="" method="post">
Tipo de busca:<br />
<input type="radio" name="tipo" value="1" id="tipo" checked="checked"/> Inicia com: <br />
<input type="radio" name="tipo" value="2" id="tipo" /> Contenha: <br />
<input type="radio" name="tipo" value="3" id="tipo" /> Termine com: <br /><br />
Buscar carro: <input type="text" name="busca" id="busca" value="" onkeyUp="carregar('tipo')"/>
</form>
<p> </p>
Resultado da busca: <br>
<div id="resultados" style="border:1px solid #CCCCCC; width:300px;">
</div>
</body>
</html>