Comunidad de diseño web y desarrollo en internet online

ajax actualizar contenido de un div include()

Citar            
MensajeEscrito el 08 Oct 2011 12:43 pm
e buscado miles y miles de veces para poder lograr que al enviar datos del form actualize el div donde se veran los mensajes publicados pero nada no encuentro quizas alguno de ustedes me puede echar una cable, y decirme que plugin bajar o que tutorial pueda ver...

mi sistema de comentarios no se conecta a ninguna bd... los comentario se agregan asi

$archivo=fopen("new.html","a");

If (!$archivo){

ECHO "NO SE PUDIERON AGRAGAR LOS DATOS";

exit;
}


fputs($archivo,$datos);

fclose($archivo);
?>

bueno quizas si quieres echarme un cable este es mi correo [email protected]

Por js_toni

93 de clabLevel



Genero:Masculino  

programar

firefox
Citar            
MensajeEscrito el 08 Oct 2011 02:27 pm
como que no entiendo mucho lo que necesitas, a ver si le achunto.

lo que posteas es el codigo con el cual insertas en un archivo los comentarios ingresados, y necesitas que esos comentarios se vayan actualizando, existen frameworks de ajax que puedes utilizar, como jquery, prototype, mootools, dojo que cada uno con su sistemas fallas y ventajas pueden hacer esa tarea de forma facil.

ahora un ajax en su definicion basica funciona con algo asi. asumiento que esto ira en un archivo .js

Código :

/*funcion que crea el ajax, o eso creo que hace siempre hago copy paste*/
function nuevoAjax() {    
    var xmlhttp=false;
    try  {
        // Creacion del objeto AJAX para navegadores no IE
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");    }
    catch(e) {
        try {
            // Creacion del objet AJAX para IE
           xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
       catch(E) { xmlhttp=false; }
   }
   if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); }
   return xmlhttp; 
}
/*esta es la funcion que hace el llamado a la pagina , esa pagina "vomita" lo que mostrara en un div*/
function cambiar(){
   ajax = nuevoAjax();
    ajax.open('POST', 'miarchivoconloscomentarios.php',true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    ajax.send("var1="+var1+"&var2="+var2);
    ajax.onreadystatechange = function() {
        if (ajax.readyState == 4) {
            document.getElementById('div_respuesta').innerHTML = ajax.responseText;
        }
    }
}

Por machvk

15 de clabLevel



 

firefox
Citar            
MensajeEscrito el 11 Oct 2011 05:16 am
bueno realmente lo que necesito es hacer una pagina con dos columnas una donde este el form para comentar y en la otra donde este la visualizacion de los comentarios para poder ver dichos comentarios sin tener que actualizar la pagina debo de usar ajax o java quizas jquery...

el codigo que me estas pasando me dices que lo guarde en un "archivo.js" luego lo llamo pero como lo integro no se nada nada de javascript

Por js_toni

93 de clabLevel



Genero:Masculino  

programar

firefox
Citar            
MensajeEscrito el 11 Oct 2011 01:03 pm
hola, se te pone dificil la pista si no sabes javascript, ya que ajax (ante peligro que me quemen en la hoguera) es javascript avanzado. tratare de ser mas detallado.
todo esto son sugerencias. ya que existe mas de una forma de pelar un coco.

columna de ingreso (formulario de comentario)
1.- formulario con los datos a ingresar.
2.- boton grabar, que ejecuta una funcion javascript (ajax) que envia al php los datos para grabar los comentario en el archivo.

Código :

      <input type="button" onclick="javascript:grabarcomentario()"> <-- algo asi lo podrias llamar
   

columna 2 visualizacion de comentarios
1.- javascript con un loop que este constantemente recargando en ajax los comentarios, digamos cada 1 minuto
la instruccion javascript para eso seria setInterval.
2.- ese javascript que se esta recargarndo constantemente puede ser esta funcion

Código :

      function cambiar(){
         ajax = nuevoAjax();
         ajax.open('POST', 'miarchivoconloscomentarios.php',true); <--- la pagina que entregara los comentarios
         ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
         ajax.send("var1="+var1);<-- variables en caso de ser necesarias
         ajax.onreadystatechange = function() {
            if (ajax.readyState == 4) {
               document.getElementById('div_respuesta').innerHTML = ajax.responseText; <-- el div donde cargara lo que reciba como respuesta.
            }
         }
      }

Por machvk

15 de clabLevel



 

firefox
Citar            
MensajeEscrito el 11 Oct 2011 06:10 pm
mira seria algo asi

<head>
<script>
function cambiar(){
ajax = nuevoAjax();
ajax.open('POST', 'miarchivoconloscomentarios.php',true); <--- la pagina que entregara los comentarios
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send("var1="+var1);<-- variables en caso de ser necesarias
ajax.onreadystatechange = function() {
if (ajax.readyState == 4) {
document.getElementById('div_respuesta').innerHTML = ajax.responseText; <-- el div donde cargara lo que reciba como respuesta.
}
}
}
</script>
</head>

index.html

<form action="pagina2.php" method="post">
<textarea rows="4" cols="82" name="comentario" class="texta"></textarea>
<input type="submit" value="Publicar" onclick="javascript:grabarcomentario()"/></form>

<div id="id="div_respuesta"></div>

<!-- -->

ahora la pagina2.php para agregar el comentario al archivo new.html

<?PHP
$texto=$_POST['comentario'];
$comentario=trim($texto);
$datos= "$comentario|\n";
$archivo=fopen("new.html","a");
if (!$archivo){
echo "Error al crear archivo";
exit;
}
fputs($archivo,$datos);
fclose($archivo);
?>
</script>

la pagina3.php donde se veran los comentarios

<?php
$archivo = file("new.html");
if (!$archivo)
{
echo "";
}
$filas=count($archivo);
for($i=0;$i<$filas;$i++)
{
$campo=explode("|",$archivo[$i]);
$comentario = $campo[0];
?>

<div class="metacom"><?php echo "$comentario"; ?></dviv>

<?php
}
?>

Por js_toni

93 de clabLevel



Genero:Masculino  

programar

firefox
Citar            
MensajeEscrito el 12 Oct 2011 02:02 pm
a ver mira crea 4 archivos. index.php, script.js, grabacomentario.php,new.html
index.php

Código :

<html>
<head>
   <title></title>
</head>
<script type="text/javascript" src="script.js"></script>
<body>
   <form name="formulario">
   <textarea rows="4" cols="82" name="comentario" class="texta"></textarea>
      <input type="button" value="Publicar" onclick="javascript:grabarcomentario()"/>
   </form>   
   
   <div id="metacom" style="border:1px solid #000;width:600px;height:200px;overflow:auto;"></div>
   
   <div id="mensaje"></div>
</body>


el archivos script.js

Código :

    /*funcion que crea el ajax, o eso creo que hace siempre hago copy paste*/
   function nuevoAjax() {    
    var xmlhttp=false;
    try  {
        // Creacion del objeto AJAX para navegadores no IE
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");    }
    catch(e) {
        try {
            // Creacion del objet AJAX para IE
           xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
       }
       catch(E) { xmlhttp=false; }
   }
   if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); }
   return xmlhttp; 
}
/*esta es la funcion que hace el llamado a la pagina , esa pagina "vomita" lo que mostrara en un div*/
function grabarcomentario(){
   comentario=document.formulario.comentario.value
   ajax = nuevoAjax();
    ajax.open('POST', 'grabacomentario.php',true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    ajax.send("comentario="+comentario);
    ajax.onreadystatechange = function() {
        if (ajax.readyState == 4) {
            // no se que hacer aca jaja
        }
    }
   actualizar();
}
function actualizar(){
   ajax = nuevoAjax();
    ajax.open('POST', 'new.html',true);
    ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    ajax.send("");
    ajax.onreadystatechange = function() {
        if (ajax.readyState == 4) {
            document.getElementById('metacom').innerHTML = ajax.responseText;
        }
    }
}

el archvio grabacomentario.php

Código :

<?php
$archivo=fopen("new.html","a");
$datos=$_POST['comentario']."<br>";
If (!$archivo){
   ECHO "NO SE PUDIERON AGRAGAR LOS DATOS";
   exit;
}
fputs($archivo,$datos);
fclose($archivo);
?>

y el archivo new.html existe pero esta vacio. ve si te sirve

Por machvk

15 de clabLevel



 

firefox
Citar            
MensajeEscrito el 13 Oct 2011 10:39 pm
epale buen script me sirvio de mucha tu lectura gracias amigo te debo una...

alfin logre loq queria tenia tiempo buscando una funcion asi por varios foros...

Gracias y Saludos

Por js_toni

93 de clabLevel



Genero:Masculino  

programar

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.