Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Riki_89D en 26 Diciembre 2010, 17:45 pm



Título: Libro de isitas sin que se vaya la pagina
Publicado por: Riki_89D en 26 Diciembre 2010, 17:45 pm
Hola como andan?¿

Veran me fije en muchas webs que cuando djas un comentario en un libro de visitas,la web no se a por unos segundos,es como si no se actualizase pero el comentario queda alli entienden?¿ cxomo el facebook que cuando dejas un comentario al mure el comentario sepone alli mismo sin que la web se actualize,como se logra eso?¿ para poner el comentario imagino con PHP pero pàra que la web no se carge i el comentario se quede alli como se logra?¿



saludos


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Siquillote en 26 Diciembre 2010, 17:48 pm

Deberás usar la tecnología AJAX para hacer esto ;)


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Riki_89D en 26 Diciembre 2010, 22:06 pm
Hola,perdona mi ignoracnia,pero esto del Ajax lo concozco pero poco,asta lo que se es una mezcla de JS+XML i algo mas no?¿ lo digomas que nada por que acabo d eve run arituclo que venia a decir que saber javascript+CSS+XML es = a saber AJAX,es eso cierto?¿



saludos


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: xassiz~ en 26 Diciembre 2010, 22:09 pm
En realidad solo tienes que printear el comentario antes de añadirlo a la DB :rolleyes:


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Riki_89D en 26 Diciembre 2010, 22:13 pm
Se me ocurrio una idea,se podria mediante javascript poner el comentario en un DIV oculto,mostrar el div cuando se de al boton de comentar,i k PHP se encargue de meterlo en la BD el problema es que siempre que uso PHP la pagina debe actualizarse :s


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Siquillote en 26 Diciembre 2010, 22:57 pm
Se me ocurrio una idea,se podria mediante javascript poner el comentario en un DIV oculto,mostrar el div cuando se de al boton de comentar,i k PHP se encargue de meterlo en la BD el problema es que siempre que uso PHP la pagina debe actualizarse :s

Tienes 2 opciones ya que AJAX es muy igualitario a los demás códigos, es decir, que casi siempre es el mismo código. Aquí te dejo un tutorial de un foro que visito paralelamente a este.

http://www.phperos.net/foro/index.php?topic=7010.0

PD: El tutorial está hecho por mi así que si tienes alguna duda, preguntamela :P


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Spider-Net en 27 Diciembre 2010, 15:10 pm
ajax.js

Código
  1. // Crea un objeto Ajax para trabajar de forma asíncrona con el servidor
  2. function objetoAjax(){
  3. var xmlhttp=false;
  4. try {
  5. xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  6. } catch (e) {
  7. try {
  8.   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  9. } catch (E) {
  10. xmlhttp = false;
  11.   }
  12. }
  13.  
  14. if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
  15. xmlhttp = new XMLHttpRequest();
  16. }
  17. return xmlhttp;
  18. }
  19.  
  20. function inserta_comentario(){
  21.                nick=document.getElementById('nick').value;
  22.                comentario=document.getElementById('comentario').value;
  23.  
  24. divResultado = document.getElementById('comentarios');
  25. ajax=objetoAjax();
  26. ajax.open("GET", "comment.php?nick="+nick+"&comentario="+comentario);
  27.                // Esta es la imagen de carga que se muestra mientras se ejecuta el php
  28. divResultado.innerHTML = '<center><img src="loading.gif"></center>';
  29. ajax.onreadystatechange=function() {
  30. if (ajax.readyState==4) {
  31. divResultado.innerHTML = ajax.responseText
  32. }
  33. }
  34. ajax.send(null)
  35. }
  36.  
Ejemplo de loading.gif: (http://www.sony.co.uk/biz/wep/menuimages/loading.gif)

comment.php
Código
  1. $nick=$_GET['nick'];
  2. $comentario=$_GET['comentario'];
  3.  
  4. // Conexión a la base de datos
  5. $usuario="user";
  6. $password="your_pass";
  7. $host="your_host";
  8. $db="db_name";
  9.  
  10. $link=mysql_connect($host,$usuario,$password) or die("Error al conectar a la base de datos");
  11. mysql_select_db($db) or die ("Se produjo un error al seleccionar la base de datos");
  12.  
  13. $sql=mysql_query("INSERT INTO comments (nick, comentario) VALUES ('$nick', '$comentario')");
  14. echo "<strong>$nick</strong><hr />";
  15. echo $comentario;
  16.  

index.html
Código
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2.      <title>Ejemplo AJAX</title>
  3.      <script type="text/javascript" src="ajax.js"></script>
  4. </head>
  5.      <input type="text" id="nick" name="nick"><br />
  6.      <input type="text" id="comentario" name="comentario"><br /><br />
  7.      <input type="button" onclick="inserta_comentario();">
  8.  
  9.      <div id="comentarios" style="background-color: #D5DFE6; width: 500px;"></div>
  10. </body>
  11.  

Esto es un ejemplo súper resumido de lo que sería una consulta AJAX (http://es.wikipedia.org/wiki/AJAX). El mismo efecto se puede conseguir de otras formas, pero he intentado hacerlo lo más sencillo posible y sin framework puesto que veo que siempre trabajas en puro javascript. Con un framework como jquery te ahorras tener que declarar el objeto ajax porque ya lo posee el framework y además la carga AJAX se realiza en una sola línea. Obviamente las variables pasadas por GET ni siquiera están siendo filtradas por lo que el código es vulnerable a XSS, pero no he querido liarlo demasiado para que lo comprendas, una vez comprendas como funciona te será sencillo aumentar la seguridad filtrando las variables con funciones php como htmlspecialchars(), stripslashes(), etc.

El ejemplo está hecho de memoria, he pillado algunos trozos de código de alguno de mis proyectos y los he dejado con lo básico pero no he probado el resultado, de todas formas debería funcionar.

Obviamente tendrás que tener una base de datos a la que conectar con una tabla "comentarios" que al menos tenga el campo 'nick' y el campo 'comentario'.


Título: Re: Libro de isitas sin que se vaya la pagina
Publicado por: Riki_89D en 27 Diciembre 2010, 17:15 pm
Perfectisimo :D,si,es cierto,casi siempre intento trabajar sin usar farmework,amenos que se haga inprescindible nose e suna amnia que tengo,no se si es bueno o malo pero es una mania que tengo en fin nose si a alguien le pasa


xd saludos y gracias de antemano