Hola!

Registrándote como bakuno podrás publicar, compartir y comunicarte en privado con otros bakuos :D

Regístrame ya!

Recargar imagen en ajax

M

Mirdrack

Bovino adicto
Desde
21 May 2008
Mensajes
529
Hola:
Necesito recargar una imagen en una página pero necesito que sea en base a una respuesta de una base de datos es decir:
Si la respuesta de la consulta la base de datos es 1 necesito poner cierta imagen
Si la respuesta es 2 poner otra imagen diferente
Esto lo podría hacer recargando toda la página pero no deseo hacerlo porque necesito hacerlo cada 5 segundos la consulta y por eso tengo entendido que requiero de AJAX

Conozco de PHP y SQL pero de AJAX prácticamente nada, espero por su ayuda
Gracias:vientos:
 
te consejaria que uses la poderosa libreira jquery que tiene funciones de ajax muy faciles de manejar e incluso soporta sessiones.
 
Te dejo un código que me encontré en internet para usar ajax con php, solo tienes que modificar la función para conectarte al servidor y evaluar la respuesta. Yo usé este código para realizar un cotizador que graba la cotización en un servidor mysql y la manda imprimir. Espero que te sirva.

Código: 
<?php
session_start();
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
// siempre modificado
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
// HTTP/1.1
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
// HTTP/1.0
header("Pragma: no-cache");
if(isset($_GET['function']) && !empty($_GET['function'])){
    function contar(){
        $_SESSION['contador']=isset($_SESSION['contador'])?$_SESSION['contador']+=1:1;
        //echo "javascript:window.print();";
        return 'document.getElementById("pepe").innerHTML="'.$_SESSION['contador'].'";';
    }
    function foto(){
        return 'document.getElementById("pepe").innerHTML="<img src=\"http://www.disegnocentell.com.ar/new/ejemplos/po.jpg\" />";';
    }
    switch($_GET['function']){
        case 'contar': echo contar();break;
        case 'foto': echo foto();break;
    }
exit;
}
?>
<!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>ejemplo</title>
<script>
function adjs(url){
    oldsc=document.getElementById("old_sc");
        if(oldsc)
            document.getElementsByTagName('body')[0].removeChild(oldsc);
    sc=document.createElement('script');
    sc.id="old_sc";
    sc.src=url+'&<?php echo SID ?>'+'&'+Math.random();
    document.getElementsByTagName('body')[0].appendChild(sc);
}
</script>
</head>

<body>
<a href="javascript:adjs('?function=contar');">Llamar a función contar de php</a> | <a href="javascript:adjs('?function=foto');">Llamar a función foto de php</a>
<div id="pepe"></div>
</body>
</html>
 
bueno he estado revisando un sobre jquery y Ajax y elabore una posible forma de cargar una imagen por ajax en base a preguntas....
lo que necesitas para probar este codigo este tener
2 imagenes : error.png y accept.png o cambiar por el que gustes
la libreria jquery lo puedes bajar desde su pagina tiene por nombre jquery-1.4.min.js

la pagina de preguntas : preguntas.php o preguntas.html
Código: 
<!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>
<script src="[COLOR=Blue]jquery-1.4.min.js[/COLOR]" type="text/javascript" language="javascript"></script>
 
<script>
[B]  $(document).ready(function(){
        $('.enviar_resp').bind('click',function(){
            var form = $(this).parent();
[/B][B]            $.post("[COLOR=Red]test.php[/COLOR]", form.serialize(), function(data){
                  var id = form.attr('id');
                  $('#img'+id).html(data);
                   form.remove();
            });        
            return false;
        });
   }); [/B]   
    
</script>    
 
</head>
 
  
<body>
    
    pregunta1
    <div id="img1"></div>
    <form id=1>
         <input type=hidden name="id_preg" value="1">
         <select  name=resp>
              <option value=1>Respuesta1</option>
              <option value=2>Respuesta2</option>
              <option value=3>Respuesta3</option>
         </select>
         <button class="enviar_resp">enviar</button>
    </form>

    
    <br>
    
    pregunta2
    <div id="img2"></div>
    <form id=2>
         <input type=hidden name="id_preg" value="2">
         <select name=resp >
              <option value=1>Respuesta1</option>
              <option value=2>Respuesta2</option>
              <option value=3>Respuesta3</option>
         </select>
         <button class="enviar_resp" >enviar</button>
    </form>
<br>    
    pregunta3
    <div id="img3"></div>
    <form id=3>
         <input type=hidden name="id_preg" value="3">
         <select name=resp>
              <option value=1>Respuesta1</option>
              <option value=2>Respuesta2</option>
              <option value=3>Respuesta3</option>
         </select>
         <button class="enviar_resp">enviar</button>
    </form>



</body>
</html>
el php que evalua la pregunta tesp.php
Código: 
<?php
 $id=$_POST['id_preg'];
 $resp=$_POST['resp'];
 
 if($resp==3){ echo '<img src="[B][COLOR=Red]accept.png[/COLOR][/B]">'; }
 else {   echo '<img src="[COLOR=Red][B]error.png[/B][/COLOR]">'; }


?>
cual quier duda solo escribe saludos....
 
Debes iniciar sesión o registrarte para participar.
Volver
Arriba