![function
mostrarConversion(e)
{
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var
cadena=obj.toJSONString();
alert(cadena);
}
4](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-4-320.jpg)
![function
mostrarConversion(e)
{
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var
cadena=obj.toJSONString();
alert(cadena);
}
Primero se define un
objeto en JavaScript
Se llama el método
JSONString para que
retorne un objeto en
formato JSON
5](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-5-320.jpg)
![<?php
$conexion=mysql_connect("localhost","root","z80")
or die("Problemas en la conexion");
mysql_select_db("bdajax",$conexion) or
die("Problemas en la seleccion de la base de datos");
$registros=mysql_query("select codigo,descripcion,precio from
perifericos",$conexion)
or die("Problemas en el select".mysql_error());
while ($reg=mysql_fetch_array($registros))
{
$vec[]=$reg;
}
require('../JSON.php');
$json=new Services_JSON();
$cad=$json->encode($vec);
echo $cad;
?>
10](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-10-320.jpg)
![De JSON a PHP (utilizando
la librería JSON.php)
AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON
FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE
LA LIBRERÍA JSON.PHP.
LA SINTAXIS ES:
$JSON=NEW SERVICES_JSON();
$CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA']));
ECHO 'NOMBRE:'.$CAD->NOMBRE;
...
...
14](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-14-320.jpg)
![ Cuando se presiona el botón procedemos a partir de un objeto JavaScript
generar una cadena en formato JSON, luego procedemos a llamar a la función
enviarDatos:
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var cadena=obj.toJSONString();
enviarDatos(cadena);
19](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-19-320.jpg)
![archivo pagina1.php
<?php
require('../JSON.php');
$json=new Services_JSON();
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
echo 'Nombre:'.$cad->nombre;
echo '<br>';
echo 'Edad:'.$cad->edad;
echo '<br>';
echo 'Primer sueldo:'.$cad->sueldos[0];
echo '<br>';
echo 'Segundo sueldo:'.$cad->sueldos[1];
echo '<br>';
echo 'Tercer sueldo:'.$cad->sueldos[2];
?>
22](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-22-320.jpg)
![ El método que convierte una cadena con formato JSON en un
objeto de PHP es:
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
Recordemos que con la función stripslashes sacamos los caracteres
de escape(barras invertidad para las comillas entre otras)
Luego podemos fácilmente acceder a los atributos del objeto con
la sintaxis
23](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-23-320.jpg)
![De JSON a PHP (utilizando
la librería JSON.php)
AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON
FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE LA
LIBRERÍA JSON.PHP.
LA SINTAXIS ES:
$JSON=NEW SERVICES_JSON();
$CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA']));
ECHO 'NOMBRE:'.$CAD->NOMBRE;
...
...](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-24-320.jpg)
![ Cuando se presiona el botón procedemos a partir de un objeto JavaScript
generar una cadena en formato JSON, luego procedemos a llamar a la función
enviarDatos:
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var cadena=obj.toJSONString();
enviarDatos(cadena);](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-29-320.jpg)
![archivo pagina1.php
<?php
require('../JSON.php');
$json=new Services_JSON();
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
echo 'Nombre:'.$cad->nombre;
echo '<br>';
echo 'Edad:'.$cad->edad;
echo '<br>';
echo 'Primer sueldo:'.$cad->sueldos[0];
echo '<br>';
echo 'Segundo sueldo:'.$cad->sueldos[1];
echo '<br>';
echo 'Tercer sueldo:'.$cad->sueldos[2];
?>](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-32-320.jpg)
![ El método que convierte una cadena con formato JSON en un
objeto de PHP es:
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
Recordemos que con la función stripslashes sacamos los caracteres
de escape(barras invertidad para las comillas entre otras)
Luego podemos fácilmente acceder a los atributos del objeto con
la sintaxis](https://image.slidesharecdn.com/unidadiiiajax-140508223302-phpapp01/85/Unidad-iii-ajax-33-320.jpg)
Unidad iii ajax
- 1. Unidad III AJAXINTEGRANTES: MIGUEL ANTONIO VÁZQUEZ MONTES 10410562 PEDRO ALEXANDER BALBUENA LOREDO 10410518 1
- 2. 22 - De JavaScript a JSON (utilizando la librería json.js) Librería Javascript. Permite convertir objeto o array de javascript a formato json y viceversa. 2
- 3. Archivos importados <script src="../json.js" language="JavaScript"></script> <script src="funciones.js" language="JavaScript"></script> 3
- 5. function mostrarConversion(e) { var obj={ nombre:'juan', edad:25, sueldos:[1200,1700,1990] }; var cadena=obj.toJSONString(); alert(cadena); } Primero se define un objeto en JavaScript Se llama el método JSONString para que retorne un objeto en formato JSON 5
- 7. 23 - De JSON a JavaScript (utilizando la librería json.js) 7
- 8. 8
- 9. 9
- 10. <?php $conexion=mysql_connect("localhost","root","z80") or die("Problemas en la conexion"); mysql_select_db("bdajax",$conexion) or die("Problemas en la seleccion de la base de datos"); $registros=mysql_query("select codigo,descripcion,precio from perifericos",$conexion) or die("Problemas en el select".mysql_error()); while ($reg=mysql_fetch_array($registros)) { $vec[]=$reg; } require('../JSON.php'); $json=new Services_JSON(); $cad=$json->encode($vec); echo $cad; ?> 10
- 11. 11
- 12. 12
- 13. 13
- 14. De JSON a PHP (utilizando la librería JSON.php) AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE LA LIBRERÍA JSON.PHP. LA SINTAXIS ES: $JSON=NEW SERVICES_JSON(); $CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA'])); ECHO 'NOMBRE:'.$CAD->NOMBRE; ... ... 14
- 15. la clase Services_JSON tiene un método llamado decode que recibe como parámetro una cadena con datos codificados en JSON y procede a retornar la información en un objeto. 15
- 16. Ejemplo: Confeccionaremos un problema que envíe desde el navegador información en formato JSON y en el servidor la convertiremos en un objeto de PHP y procederemos a generar un trozo de HTML que retornaremos al navegador para que lo muestre. 16
- 17. El archivo pagina1.html <html> <head> <title>Problema</title> <script src="../json.js" language="JavaScript"></script> <script src="funciones.js" language="JavaScript"></script> </head> <body> <h2>Enviar datos desde el navegador en formato JSON y proceder a la decodificación en una clase PHP con la librería JSON.php</h2> <input type="button" value="Enviar" id="boton1"> <div id="resultados"></div> </body> </html> 17
- 19. Cuando se presiona el botón procedemos a partir de un objeto JavaScript generar una cadena en formato JSON, luego procedemos a llamar a la función enviarDatos: var obj={ nombre:'juan', edad:25, sueldos:[1200,1700,1990] }; var cadena=obj.toJSONString(); enviarDatos(cadena); 19
- 20. La función enviarDatos procede a crear un objeto de la clase XMLHttpRequest y pasa mediante el parámetro GET la cadena en formato JSON: var conexion1; function enviarDatos(cadena) { conexion1=crearXMLHttpRequest(); conexion1.onreadystatechange = procesarEventos; conexion1.open('GET','pagina1.php?cadena='+cadena, true); conexion1.send(null); } 20
- 21. Solo queda mostrar el trozo de datos en HTML que retorna el servidor: function procesarEventos() { var resultados = document.getElementById("resultados"); if(conexion1.readyState == 4) { resultados.innerHTML = conexion1.responseText; } else { resultados.innerHTML = "Cargando..."; } } 21
- 22. archivo pagina1.php <?php require('../JSON.php'); $json=new Services_JSON(); $cad=$json->decode(stripslashes($_REQUEST['cadena'])); echo 'Nombre:'.$cad->nombre; echo '<br>'; echo 'Edad:'.$cad->edad; echo '<br>'; echo 'Primer sueldo:'.$cad->sueldos[0]; echo '<br>'; echo 'Segundo sueldo:'.$cad->sueldos[1]; echo '<br>'; echo 'Tercer sueldo:'.$cad->sueldos[2]; ?> 22
- 23. El método que convierte una cadena con formato JSON en un objeto de PHP es: $cad=$json->decode(stripslashes($_REQUEST['cadena'])); Recordemos que con la función stripslashes sacamos los caracteres de escape(barras invertidad para las comillas entre otras) Luego podemos fácilmente acceder a los atributos del objeto con la sintaxis 23
- 24. De JSON a PHP (utilizando la librería JSON.php) AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE LA LIBRERÍA JSON.PHP. LA SINTAXIS ES: $JSON=NEW SERVICES_JSON(); $CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA'])); ECHO 'NOMBRE:'.$CAD->NOMBRE; ... ...
- 25. la clase Services_JSON tiene un método llamado decode que recibe como parámetro una cadena con datos codificados en JSON y procede a retornar la información en un objeto.
- 26. Ejemplo: Elaboraremos un problema que envíe desde el navegador información en formato JSON y en el servidor la convertiremos en un objeto de PHP y procederemos a generar un trozo de HTML que retornaremos al navegador para que lo muestre.
- 27. El archivo pagina1.html <html> <head> <title>Problema</title> <script src="../json.js" language="JavaScript"></script> <script src="funciones.js" language="JavaScript"></script> </head> <body> <h2>Enviar datos desde el navegador en formato JSON y proceder a la decodificación en una clase PHP con la librería JSON.php</h2> <input type="button" value="Enviar" id="boton1"> <div id="resultados"></div> </body> </html>
- 29. Cuando se presiona el botón procedemos a partir de un objeto JavaScript generar una cadena en formato JSON, luego procedemos a llamar a la función enviarDatos: var obj={ nombre:'juan', edad:25, sueldos:[1200,1700,1990] }; var cadena=obj.toJSONString(); enviarDatos(cadena);
- 30. La función enviarDatos procede a crear un objeto de la clase XMLHttpRequest y pasa mediante el parámetro GET la cadena en formato JSON: var conexion1; function enviarDatos(cadena) { conexion1=crearXMLHttpRequest(); conexion1.onreadystatechange = procesarEventos; conexion1.open('GET','pagina1.php?cadena='+cadena, true); conexion1.send(null); }
- 31. Solo queda mostrar el trozo de datos en HTML que retorna el servidor: function procesarEventos() { var resultados = document.getElementById("resultados"); if(conexion1.readyState == 4) { resultados.innerHTML = conexion1.responseText; } else { resultados.innerHTML = "Cargando..."; } }
- 32. archivo pagina1.php <?php require('../JSON.php'); $json=new Services_JSON(); $cad=$json->decode(stripslashes($_REQUEST['cadena'])); echo 'Nombre:'.$cad->nombre; echo '<br>'; echo 'Edad:'.$cad->edad; echo '<br>'; echo 'Primer sueldo:'.$cad->sueldos[0]; echo '<br>'; echo 'Segundo sueldo:'.$cad->sueldos[1]; echo '<br>'; echo 'Tercer sueldo:'.$cad->sueldos[2]; ?>
- 33. El método que convierte una cadena con formato JSON en un objeto de PHP es: $cad=$json->decode(stripslashes($_REQUEST['cadena'])); Recordemos que con la función stripslashes sacamos los caracteres de escape(barras invertidad para las comillas entre otras) Luego podemos fácilmente acceder a los atributos del objeto con la sintaxis