Foros del Web » Programando para Internet » Javascript » Frameworks JS »

[SOLUCIONADO] Actualizar comentarios ajax (enviando formulario)

Estas en el tema de Actualizar comentarios ajax (enviando formulario) en el foro de Frameworks JS en Foros del Web. Hola,estoy creando mi sistema de comentarios,y quiero que no se tenga que recargar la página para ver la segunda página de comentarios. Estos son mis ...
  #1 (permalink)  
Antiguo 11/06/2011, 07:52
 
Fecha de Ingreso: diciembre-2010
Mensajes: 28
Antigüedad: 14 años
Puntos: 0
Actualizar comentarios ajax (enviando formulario)

Hola,estoy creando mi sistema de comentarios,y quiero que no se tenga que recargar la página para ver la segunda página de comentarios.

Estos son mis codigos:

comentarios.php
Código HTML:
 <?php
 include 'config.php'
 ?>
  <?php 

// maximo por pagina 

$limit = 3; 

 

// pagina pedida 

$pag = $_POST["pag"]; 

if ($pag < 1) 

{ 

   $pag = 1; 

} 

$offset = ($pag-1) * $limit; 

 

 

$sql = "SELECT SQL_CALC_FOUND_ROWS * FROM comentarios_com ORDER BY fecha DESC LIMIT $offset, $limit"; 

$sqlTotal = "SELECT FOUND_ROWS() as total"; 

 

$rs = mysql_query($sql); 

$rsTotal = mysql_query($sqlTotal); 

 

$rowTotal = mysql_fetch_assoc($rsTotal); 

// Total de registros sin limit 

$total = $rowTotal["total"]; 

 

?>

<?php 

         while ($row = mysql_fetch_assoc($rs)) 

         { 

            $id = $row["id"]; 

			$comentario = $row["comentario"]; 

			$comentador = $row["comentador"]; 

			$fecha = $row["fecha"];

		 

		 ?>

  



  

  <div id="comment_section">

    <ol class="comments first_level">

      <li>

        <div class="comment_box commentbox1">

          <div class="gravatar"> <img src="images/avatar-none.png" alt="author 1" /> </div>

          <div class="comment_text">

            <div class="comment_author"><?php echo $comentador ?><span class="time"><?php echo $fecha ?></span></div> 

            <p><?php echo $comentario ?></p>

          </div>

          <div class="cleaner"></div>

        </div>

      </li>

      <li></li>

    </ol>

  </div>

  <?php 

         } 

      ?>
	    <div class="post_section">

    <form id="comentarios" name="comentarios" method="post" action="comentarios.php">
    
	      <label>
	
	  <?php 
	  $pagina = $pag + 1;
	  ?>
	      <input name="pag" type="text" id="pag" value="<?php echo $pagina ?>" />
	      </label>
	      <label>
	      <input name="enviar" type="submit" id="enviar" value="Enviar" />
	      </label>
    </form>
    <p>&nbsp;</p>

</div> 
comunidad.php
Código PHP:
<script language="javascript" src="jquery-1.3.min.js"></script> 

<script language="javascript"> 

$(document).ready(function() {

   // Esta primera parte crea un loader no es necesaria

    $().ajaxStart(function() {

        $('#loading').show();

        $('#comentarios').hide();

    }).ajaxStop(function() {

        $('#loading').hide();

        $('#comentarios').fadeIn('slow');

    });

   // Interceptamos el evento submit

    $('#form, #comentarios, #comentarios').submit(function() {

  // Enviamos el formulario usando AJAX

        $.ajax({

            type: 'POST',

            url: $(this).attr('action'),

            data: $(this).serialize(),

            // Mostramos un mensaje con la respuesta de PHP

            success: function(data) {

                $('#comentarios').html(data);

            }

        })        

        return false;

    }); 

})  

</script> 
<script language="javascript"> 

$(document).ready(function() {

   // Esta primera parte crea un loader no es necesaria

    $().ajaxStart(function() {

        $('#loading').show();

        $('#result').hide();

    }).ajaxStop(function() {

        $('#loading').hide();

        $('#result').fadeIn('slow');

    });

   // Interceptamos el evento submit

    $('#form, #fat, #fo3').submit(function() {

  // Enviamos el formulario usando AJAX

        $.ajax({

            type: 'POST',

            url: $(this).attr('action'),

            data: $(this).serialize(),

            // Mostramos un mensaje con la respuesta de PHP

            success: function(data) {

                $('#result').html(data);

            }

        })        

        return false;

    }); 

})  

</script> 

</head>

<body>



<div id="templatemo_header_wrapper">

    <div id="templatemo_header">

        

       <div id="site_title">

            <h1><a href="index.html">

            <img src="images/templatemo_logo.png" alt=" VidaGame"/></a></h1>

      </div>

        

  

    

    </div> <!-- end of header -->

    

    <div id="templatemo_menu">

    

        <ul>

            <li><a href="inicio">Inicio</a></li>

            <li><a href="comunidad" class="current">Comunidad</a></li>

            <li><a href="juegos">Juegos</a></li>

            <li><a href="tutoriales">Tutoriales</a></li>

        </ul>        

    

    </div>

    

</div> <!-- end of header wrapper -->



<div id="templatemo_main_wrapper">

<div id="templatemo_content_wrapper">



    <div id="templatemo_content">

     
        <div class="comment_tab">

                <?php

$query 
mysql_query("SELECT count(*) FROM comentarios_com") or die (mysql_error());

$resultados mysql_result($query,0);

echo 
"$resultados";

?>&nbsp;

comentarios</div>

     
<div id="comentarios"><?php include 'comentarios.php' ?></div>
<div id="result"></div> 

          <div id="comment_form">

                    <h3>Deja un comentario</h3>

                    

            <form method="post" action="comentar_comunidad.php" id="fo3" name="fo3">

              <div class="form_row">

                <label>Nombre:</label>

                            <br />

                            <input type="text" name="name" />

              </div>

                <div class="form_row">

                          <label>Escribre el comentario:</label>

                          <br />

                            <textarea  name="comment" rows="" cols=""></textarea>

              </div>



                <input name="Envia el comentario" type="submit" class="submit_btn" id="Envia el comentario" value="Enviar" />

            </form>

                    

        </div>
El div de comentarios se actualiza y todo pero..cuando se actualiza más de 1 vez,se me carga toda la página en el div.
Veanlo ustedes mismos; http://vidagame.tk/comunidad
  #2 (permalink)  
Antiguo 11/06/2011, 08:32
 
Fecha de Ingreso: abril-2011
Mensajes: 1.342
Antigüedad: 13 años, 7 meses
Puntos: 344
Respuesta: Actualizar comentarios ajax (enviando formulario)

Tienes bastantes errores de concepto, por ejemplo, un id debe ser único y tú utilizas el id comentarios en dos sitios distintos. Si quieres que más de un elemento tengan características parecidas usa class.

Luego en las llamadas con $("#form, #comentarios,#comentarios):

El id form no existe en ningún lugar, si te querías referir a los formularios es sin el #.

No sé porque pones dos veces #comentarios, con uno valdría.

Eso es para empezar. Arregla esos fallos antes de nada.
  #3 (permalink)  
Antiguo 13/06/2011, 08:08
 
Fecha de Ingreso: diciembre-2010
Mensajes: 28
Antigüedad: 14 años
Puntos: 0
Respuesta: Actualizar comentarios ajax (enviando formulario)

Vale,ya he arreglado los errores,igualmente sigue haciendo lo mismo...algna otra idea?

Gracias

Etiquetas: ajax, comentarios, formulario
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:32.