Luego de la búsqueda se listan los resultados, si algunos de los resultados me interesa tendría que poder hacer clic arriba y que me los cargue en la misma web sin necesidad de recargar.
Esta ultima parte no me esta funcionando, y nose porque!!!
Me podrían dar una mano? MILLONES DE GRACIAS.
DEJO El codigo de los archivos.
____________________________________________
busqueda.html
Código PHP:
<!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>Busqueda</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".buscar").keyup(function(){
var cajabusqueda = $(this).val();
var dataString = 'buscarpalabra='+ cajabusqueda;
if(cajabusqueda==''){
}else{
$.ajax({
type: "POST",
url: "buscar.php",
data: dataString,
cache: false,
success: function(html){
$("#display").html(html).show();
}
});
}return false;
});
$(document).on("click","#display_box",function(){
var id = $(this).val();
var dataString = 'id='+ codigo;
$.ajax({
type: "POST",
url: "loadData.php", // acá iría el php nuevo
data: dataString,
cache: false,
success: function(html){
$("#display").html(html).show(); //Y acá un id nuevo que vaya en el medio de la pantalla principal
}
});
});
});
jQuery(function($){
$("#cajabusqueda").Watermark("Buscar");
});
</script>
<style type="text/css">
body
{
font-family:"Lucida Sans";
}
*
{
margin:0px
}
#cajabusqueda
{
width:250px;
padding:3px;
margin-left:250px;
}
#display
{
width:254px;
display:none;
float:right; margin-right:1px;
border-left:solid 1px #dedede;
border-right:solid 1px #dedede;
border-bottom:solid 1px #dedede;
overflow:hidden;
}
#display_box
{
padding:7px; border-top:solid 1px #dedede; font-size:12px; height:30px; background:#ECECEC;
}
.display_box:hover
{
background:#3b5998;
color:#FFFFFF;
}
#shade
{
background-color:#00CCFF;
}
</style>
</head>
<body>
<div style=" padding:10px; height:25px; background:#3b5998; background: left no-repeat #3b5998 ">
<div style="width: 250px; float: none; margin-right: 30px">
<input type="text" class="buscar" id="cajabusqueda" /><br />
<div id="display">
</div>
</div>
</div>
<p> </p>
<p> </p>
<p> </p>
<div style="margin-top:20px; margin-left:20px">
</div>
</body>
</html>
_____________ BUSCAR.PHP____________________
Código PHP:
<?php
include('configuracion.php');
if($_POST)
{
$q=$_POST['buscarpalabra'];
$sql_res1=mysql_query("select * from notas where (notas.nombre like '%$q%' or notas.nota1 like '%$q%' or notas.nota2 like '%$q%')");
while($row=mysql_fetch_array($sql_res1))
{
$fbnombre=$row['nombre'];
$apellido=$row['nota1'];
$ciudad=$row['codigo'];
$re_fbnombre='<b>'.$q.'</b>';
$re_apellido='<b>'.$q.'</b>';
$final_fbnombre = str_ireplace($q, $re_fbnombre, $fbnombre);
$final_apellido = str_ireplace($q, $re_apellido, $apellido);
?>
<div id="display_box" value='<?=$id?>' align="left">
<?php echo $final_fbnombre; ?> <?php echo $final_apellido; ?>
<br/>
<span style="font-size:9px; color:#999999"><?php echo $ciudad; ?></span>
</div>
<?php
}
}
else
{
}
?> Código HTML:
<?php include('configuracion.php'); if($_POST) { $q=$_POST['id']; $sql_res1=mysql_query("select * from notas where (id = '%$q%'); while($row=mysql_fetch_array($sql_res1)) { $fbnombre=$row['nombre']; $apellido=$row['nota1']; $ciudad=$row['nota2']; <div class="display_box" value='<?=$id?>' align="left"> <?php echo $final_fbnombre; ?> <?php echo $final_apellido; ?> <br/> <span style="font-size:9px; color:#999999"><?php echo $ciudad; ?></span> </div> <?php } } else { } ?>
_______________________JQUEY.WATERMARKINPUT.JS____ _______
/*
* Copyright (c) 2007 Josh Bush (digitalbush.com)
*
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use,
* copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following
* conditions:
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
* OTHER DEALINGS IN THE SOFTWARE.
*/
/*
* Version: Beta 1
* Release: 2007-06-01
*/
(function($) {
var map=new Array();
$.Watermark = {
ShowAll:function(){
for (var i=0;i<map.length;i++){
if(map[i].obj.val()==""){
map[i].obj.val(map[i].text);
map[i].obj.css("color",map[i].WatermarkColor);
}else{
map[i].obj.css("color",map[i].DefaultColor);
}
}
},
HideAll:function(){
for (var i=0;i<map.length;i++){
if(map[i].obj.val()==map[i].text)
map[i].obj.val("");
}
}
}
$.fn.Watermark = function(text,color) {
if(!color)
color="#aaa";
return this.each(
function(){
var input=$(this);
var defaultColor=input.css("color");
map[map.length]={text:text,obj:input,DefaultColor:defaultColor,Wa termarkColor:color};
function clearMessage(){
if(input.val()==text)
input.val("");
input.css("color",defaultColor);
}
function insertMessage(){
if(input.val().length==0 || input.val()==text){
input.val(text);
input.css("color",color);
}else
input.css("color",defaultColor);
}
input.focus(clearMessage);
input.blur(insertMessage);
input.change(insertMessage);
insertMessage();
}
);
};
})(jQuery);
_________________________________
Me esta faltando agregar el de configuracion.php que es donde conecta a la base ( que eso funciona ) y el jquery.js que no creo sea necesario..
el link del proyecto es este http://wakemedios.com/buscar/busqueda.html
MILLONES DE GRACIAS.
