elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Usando Git para manipular el directorio de trabajo, el índice y commits (segunda parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web
| | |-+  PHP (Moderador: #!drvy)
| | | |-+  ajax recibir daros		0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] 2 Ir Abajo Respuesta Imprimir
Autor Tema: ajax recibir daros  (Leído 7,071 veces)
jalbtercero

Desconectado Desconectado

Mensajes: 80


Ver Perfil
ajax recibir daros
« en: 22 Mayo 2016, 22:01 pm »
Hola tengo una funciopn para recibir los datos en ajax sin actualizar la pagina solo el div, alguien me podria facilitar un codigo de ejemplo para enviar datos con ajaz sin actualizar pagina
« Última modificación: 22 Mayo 2016, 22:28 pm por jalbtercero » En línea
gAb1


Desconectado Desconectado

Mensajes: 731


Ver Perfil
Re: ajax recibir daros
« Respuesta #1 en: 23 Mayo 2016, 00:42 am »
JQuery tiene una función llamada serializeArray que guarda el formulario en un array con el nombre del elemento y el valor. Luego simplemente con la función post envias el array y puedes actualizar el div con la respuesta del servidor.
En línea
jalbtercero

Desconectado Desconectado

Mensajes: 80


Ver Perfil
Re: ajax recibir daros
« Respuesta #2 en: 23 Mayo 2016, 00:48 am »
Cita de: gAb1 en 23 Mayo 2016, 00:42 am
JQuery tiene una función llamada serializeArray que guarda el formulario en un array con el nombre del elemento y el valor. Luego simplemente con la función post envias el array y puedes actualizar el div con la respuesta del servidor.

ok me aclarare por si acaso: Tengo dos .php 1 inserta los elemntos en la base de datos y el otro los carga en una pagina y los actualizo con ajax, lo quye quiero es con ajax enviar los datos a la base de datos sin tener que actualizar la pagina


Ajax:
Código
  1. function objetoAjax(){
  2. 	var xmlhttp=false;
  3. 	try {
  4. 		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  5. 	} catch (e) {
  6.  
  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. //Función para recoger los datos del formulario y enviarlos por post  
  21. function enviarDatosEmpleado(){
  22.  
  23.  
  24.   divResultado = document.getElementById('contenedor');
  25.  
  26.   mensaje=document.from.mensaje.value;
  27.  
  28.  
  29.   ajax=objetoAjax();
  30.  
  31.  
  32.   ajax.open("POST", "ingresar.php",true);
  33.  
  34.   ajax.onreadystatechange=function() {
  35.  
  36.   	if (ajax.readyState==4) {
  37.  
  38. 		divResultado.innerHTML = ajax.responseText
  39.  
  40. 		LimpiarCampos();
  41. 	}
  42.  }
  43. 	ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  44.  
  45. 	ajax.send("mensaje="+mensaje);
  46. }
  47.  
  48. function LimpiarCampos() {
  49.   document.form.mensaje.value="";
  50. }
  51.  

ingresar.php
Código
  2. require("connect_db.php");
  3. $nombre = $_SESSION['usuario'];
  4. $mensaje = $_POST['mensaje'];
  5.  
  6. mysql_query("INSERT INTO chat VALUES('$nombre','$mensaje')");
  7. mysql_close($link);
  8.  

cargar.php
Código
  1. <?php
  3. require("connect_db2.php");
  4.  
  5. $colo = "#320EF8";
  6. function mostrarDatos($resultados ,$color) {
  7. if($resultados !=NULL){
  8.  
  9. 	       echo "<p style='display: inline; color: $color; font-size: 120%; margin-left: 8px;'>".$resultados['nombre']."</p>";
  10.                echo ": ";
  11.                echo $resultados['mensaje'];
  12.                echo "</br>";
  13.                echo "-------------------------------------------------------------------";
  14.  
  15.                echo "</br>"; 
  16.  
  17.  
  18.  
  19.  
  20.  
  21.  
  22.  
  23. 	} else {
  24.  
  25. 	echo "<br/>No hay mas datos<br/>";
  26. }
  27. }
  28.  
  29.  
  30. $result = mysqli_query($link,"SELECT * FROM chat");
  31.  
  32.  
  33. while($fila = mysqli_fetch_array($result)) {
  34. 	mostrarDatos($fila, $colo);
  35. }
  37. mysqli_close($link);
  38.  

pagina:

Código
  3.         <script language="javascript" type="text/javascript" src="enviar.js"></script>
  4. 	<link rel="stylesheet" type="text/css" href="chat.css">
  5.         <link rel="stylesheet" type="text/css" href="inicio.css">
  6. 	<script src="ajax.js"></script>
  7. </head>
  8. <body background="fondos/fondo-inicio.jpg"">
  9. <ul>
  10.   <li><a class="active" href="inicio.php">Inicio</a></li>
  11.   <li><a href="paginaad.php">Administracion</a></li>
  12.   <li><a href="comentarios.php">Reporta</a></li>
  13.   <ul style="float:right;list-style-type:none;">
  14.     <li><a href="#about">Sobre mi</a></li>
  15.     <li><a href="salir.php">Logout</a></li>
  16.   </ul>
  17. </ul>
  18. 	<div id="contenedor">
  19. 	</div>
  20. 	<form action="" method="POST" name="form" onsubmit="enviarDatosEmpleado(); return false">
  21. 		<input type="text" id="mensaje" name="mensaje">
  22. 		<input type="submit" id="boton" value="Enviar">
  23. 	</form>
  24.  
  27. </body>
  28. </html>
  29.  
« Última modificación: 23 Mayo 2016, 01:14 am por jalbtercero » En línea
gAb1


Desconectado Desconectado

Mensajes: 731


Ver Perfil
Re: ajax recibir daros
« Respuesta #3 en: 24 Mayo 2016, 02:20 am »
Te recomiendo que uses JQuery para este tipo de cosas ya que es mucho más sencillo que todo eso que estás haciendo (casi ni lo entiendo  :rolleyes:).

No necesitas usar el elemento form si vas a enviar por ajax, por lo que lo puedes quitar. Tampoco necesitas un input submit, cambialo por un anchor (y por cierto, los inputs hay que cerrarlos):

Código
  1. <div id="contenedor"></div>
  2. <input type="text" id="mensaje" name="mensaje" />
  3. <a id="boton" href="#">Enviar</a>

Esto sería enviar.js:

Código
  1. $(function () {
  2.     $('#boton').on('click', function () {
  3.         var mensaje = $('#mensaje').val(),
  4.             ajax    = $.post('mensaje.php?op=1', { s: mensaje } );
  5.  
  6.         ajax.done(function() {
  7.             var content = $.get('mensaje.php?op=2');
  8.             $('#contenedor').empty().append( content );
  9.             $('#mensaje').val('');
  10.         });
  11.     });
  12. });

Y esto mensaje.php (ingresar.php y cargar.php juntos):

Código
  1. <?php
  2.  
  4.  
  5. require('connect_db2.php');
  6.  
  7. $op = (int) $_GET['op'];
  8.  
  9. if ($op === 1) {
  10.     $nombre  = $_SESSION['usuario'];
  11.     $mensaje = $_POST['mensaje'];
  12.  
  13.     mysqli_query($link, "INSERT INTO chat (nombre, mensaje) VALUES('$nombre', '$mensaje')");
  14.     mysqli_close($link);
  15.  
  16. } else if ($op === 2) {
  17.     $color = '#320EF8';
  18.  
  19.     function mostrarDatos($resultados, $color) {
  20.         if($resultados !== NULL) {
  21.             $mensaje = '<p style="display: inline; color: ' . $color . '; font-size: 120%; margin-left: 8px;">' . $resultados['nombre'] . ': </p>' .
  22.                        $resultados['mensaje'] . '<br /><hr><br />';
  23.         } else $mensaje = '<br />No hay mas datos<br />';
  24.  
  25.         return $mensaje;
  26.     }
  27.  
  28.     $result = mysqli_query($link, 'SELECT * FROM chat');
  29.  
  30.     while ($fila = mysqli_fetch_array($result)) {
  31.         echo mostrarDatos($fila, $color);
  32.     }
  33.  
  34.     mysqli_free_result($result);
  35.     mysqli_close($link);
  36. }
  37.  
  38. ?>
« Última modificación: 24 Mayo 2016, 02:23 am por gAb1 » En línea
jalbtercero

Desconectado Desconectado

Mensajes: 80


Ver Perfil
Re: ajax recibir daros
« Respuesta #4 en: 24 Mayo 2016, 11:08 am »
Cita de: gAb1 en 24 Mayo 2016, 02:20 am
Te recomiendo que uses JQuery para este tipo de cosas ya que es mucho más sencillo que todo eso que estás haciendo (casi ni lo entiendo  :rolleyes:).

No necesitas usar el elemento form si vas a enviar por ajax, por lo que lo puedes quitar. Tampoco necesitas un input submit, cambialo por un anchor (y por cierto, los inputs hay que cerrarlos):

Código
  1. <div id="contenedor"></div>
  2. <input type="text" id="mensaje" name="mensaje" />
  3. <a id="boton" href="#">Enviar</a>


Esto sería enviar.js:

Código
  1. $(function () {
  2.     $('#boton').on('click', function () {
  3.         var mensaje = $('#mensaje').val(),
  4.             ajax    = $.post('mensaje.php?op=1', { s: mensaje } );
  5.  
  6.         ajax.done(function() {
  7.             var content = $.get('mensaje.php?op=2');
  8.             $('#contenedor').empty().append( content );
  9.             $('#mensaje').val('');
  10.         });
  11.     });
  12. });

Y esto mensaje.php (ingresar.php y cargar.php juntos):

Código
  1. <?php
  2.  
  4.  
  5. require('connect_db2.php');
  6.  
  7. $op = (int) $_GET['op'];
  8.  
  9. if ($op === 1) {
  10.     $nombre  = $_SESSION['usuario'];
  11.     $mensaje = $_POST['mensaje'];
  12.  
  13.     mysqli_query($link, "INSERT INTO chat (nombre, mensaje) VALUES('$nombre', '$mensaje')");
  14.     mysqli_close($link);
  15.  
  16. } else if ($op === 2) {
  17.     $color = '#320EF8';
  18.  
  19.     function mostrarDatos($resultados, $color) {
  20.         if($resultados !== NULL) {
  21.             $mensaje = '<p style="display: inline; color: ' . $color . '; font-size: 120%; margin-left: 8px;">' . $resultados['nombre'] . ': </p>' .
  22.                        $resultados['mensaje'] . '<br /><hr><br />';
  23.         } else $mensaje = '<br />No hay mas datos<br />';
  24.  
  25.         return $mensaje;
  26.     }
  27.  
  28.     $result = mysqli_query($link, 'SELECT * FROM chat');
  29.  
  30.     while ($fila = mysqli_fetch_array($result)) {
  31.         echo mostrarDatos($fila, $color);
  32.     }
  33.  
  34.     mysqli_free_result($result);
  35.     mysqli_close($link);
  36. }
  37.  
  38. ?>

@gAb1 Gracias peroi el mensaje no se guarda en la base de datos, el nombre si pero no el mensaje
En línea
jalbtercero

Desconectado Desconectado

Mensajes: 80


Ver Perfil
Re: ajax recibir daros
« Respuesta #5 en: 24 Mayo 2016, 11:12 am »
Cita de: gAb1 en 24 Mayo 2016, 02:20 am





Y esto mensaje.php (ingresar.php y cargar.php juntos):

Código
  1. <?php
  2.  
  3.  
  4.  
  5. $op = (int) $_GET['op'];
  6.  
  7.  
  8.  

No entiendo muy bien que hace esta linea esta cogiendo un valor int a traves de GET con el nombree op..
En línea
gAb1


Desconectado Desconectado

Mensajes: 731


Ver Perfil
Re: ajax recibir daros
« Respuesta #6 en: 24 Mayo 2016, 21:13 pm »
El código debería funcionar bien, no veo ningún fallo.

Para este tipo de casos tienes que hacer debug: pon un alert(mensaje) en el script y mira si al hacer click en enviar se muestra el mensaje que pusiste. Si se muestra, habrá que ver si se está enviando el mensaje por post al archivo mensaje.php, para ello pon un echo $mensaje en dentro del primer if y otro alert(data) en el script enviar.js:

Código
  1. if ($op === 1) {
  2.     $nombre  = $_SESSION['usuario'];
  3.     $mensaje = $_POST['mensaje'];
  4.     echo $mensaje;/*
  5.     mysqli_query($link, "INSERT INTO chat (nombre, mensaje) VALUES('$nombre', '$mensaje')");
  6.     mysqli_close($link);*/
  7.  
  8. }

Código
  1.     $(function () {
  2.         $('#boton').on('click', function () {
  3.             var mensaje = $('#mensaje').val(),
  4.                 ajax    = $.post('mensaje.php?op=1', { s: mensaje } );
  5.      alert(mensaje);
  6.             ajax.done(function(data) {
  7.      alert(data);/*
  8.                 var content = $.get('mensaje.php?op=2');
  9.                 $('#contenedor').empty().append( content );
  10.                 $('#mensaje').val('');*/
  11.             });
  12.         });
  13.     });

La linea que coge el valor int en el archivo mensaje.php se utiliza para saber si vas a guardar datos en la db o vas a cogerlos. Así no necesitas tener dos archivos, solo 1.
En línea
AlbertoBSD
Programador y
Moderador Global
***
Desconectado Desconectado

Mensajes: 3.696


🏴 Libertad!!!!!


Ver Perfil WWW
Re: ajax recibir daros
« Respuesta #7 en: 24 Mayo 2016, 22:13 pm »
Te comento nuevamente por aqui si hay falla en el ajax esta mandando el mensaje en una variable llamada "s".

Y en el PHP la quiee recivir con el nombre de "mensaje".

La otra es que es vulnerable a SQLinjection Por que no sanitiza sus variables de entrada.

Saludos.
En línea
Keyhunters telegram group (English)
gAb1


Desconectado Desconectado

Mensajes: 731


Ver Perfil
Re: ajax recibir daros
« Respuesta #8 en: 24 Mayo 2016, 22:33 pm »
Ah! Fallo mio, el copia pega xD gracias AlbertoBSD por darte cuenta.

Código
  1. $.post('mensaje.php?op=1', { mensaje: mensaje } );

No dije nada sobre comprobar la variable porque creia que ya lo tendria controlado. De todas maneras lo pongo que no cuesta nada:

Un mínimo de seguridad sería:

Código
  1. $mensaje = filter_input(INPUT_POST, 'mensaje', FILTER_SANITIZE_STRING);

Aunque sería mucho más seguro si usaras prepared statements.
En línea
AlbertoBSD
Programador y
Moderador Global
***
Desconectado Desconectado

Mensajes: 3.696


🏴 Libertad!!!!!


Ver Perfil WWW
Re: ajax recibir daros
« Respuesta #9 en: 24 Mayo 2016, 22:59 pm »
yo uso para sanitizar los inputs que van a mysql

http://php.net/manual/en/mysqli.real-escape-string.php

Tengo una rutina que procesa todo el array GET o POST y me ll devuelve sanitizado.

Asi mismo casi no guardo valores en texto plano

Solo el ID que siempre proceso con intval() los demas valores los cifro con AES o algunos valores como los passwords guardo solo guardo un substring del hash del hash del enesimo hash.

Aunque tambien sirve el base64_encode etc...

Al rato qur llegue a mi casa pego la funcion que uso para sanitizar todo el array.

Saludos
En línea
Keyhunters telegram group (English)
Páginas: [1] 2 Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
[Tutorial] - Login con ajax . Mysql || Php con clases || Ajax « 1 2 »
PHP 		Hadess_inf 15 26,380 Último mensaje 9 Diciembre 2010, 02:44 am
por delorian15
alguien sabe como actualizar una base de daros de wow tinity core a la 3.3.5a
Dudas Generales 		darck113 0 2,420 Último mensaje 3 Noviembre 2011, 03:18 am
por darck113
Recibir comunicaciones de red
Programación General 		eb4bgr 0 1,418 Último mensaje 19 Febrero 2013, 18:29 pm
por eb4bgr
Recibir datos a través de AJAX diferentes divs
Desarrollo Web 		itzg3 4 2,179 Último mensaje 10 Abril 2014, 22:36 pm
por itzg3
Daros las gracias
Foro Libre 		flacc 2 2,379 Último mensaje 22 Octubre 2022, 22:38 pm
por Danielㅤ
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines