Búsqueda personalizada
 
 
 
 
$.getJSON
 

La función getJSON hace una petición de datos al servidor considerando que retorna la información con notación JSON. La sintaxis de esta función es:

$.getJSON([nombre de la página], [parámetros], [función que recibe los datos])  

La función getJSON procede a generar un objeto en JavaScript y nosotros en la función lo procesamos.

Problema:Confeccionar un sitio que permita ingresar el documento de una persona y nos retorne su apellido, nombre y lugar donde debe votar.

pagina1.html

<html>
<head>
<title>Problema</title>
<link rel="StyleSheet" href="estilos.css" type="text/css">
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript" src="funciones.js"></script>
</head>
<body>
Ingrese dni (solo existen los valores 1,2 y 3):<input type="text" 
name="dni" id="dni" size="10"><br>
<input type="button" value="Enviar" id="boton1">
<div id="resultados"></div>
</body>
</html> 

fuciones.js

var x;
x=$(document);
x.ready(inicializarEventos);

function inicializarEventos()
{
  var x;
  x=$("#boton1");
  x.click(presionSubmit);
}

function presionSubmit()
{
  var v=$("#dni").attr("value");
  $.getJSON("pagina1.php",{dni:v},llegadaDatos); 
  return false;
}

function llegadaDatos(datos)
{
 $("#resultados").html("Nombre:"+datos.nombre+
                       "<br>"+"Apellido:"+
                       datos.apellido+"<br>"+
                       "Direccion:"+datos.direccion);
}

pagina1.php

<?php
header('Content-Type: text/txt; charset=ISO-8859-1');
$nombre='';
$apellido='';
$direccion='';
if ($_REQUEST['dni']=='1')
{
  $nombre='Juan';
  $apellido='Rodriguez';
  $direccion='Colon 123';
}
if ($_REQUEST['dni']=='2')
{
  $nombre='Ana';
  $apellido='Maldonado';
  $direccion='Lima 245';
}
if ($_REQUEST['dni']=='3')
{
  $nombre='laura';
  $apellido='Pueyrredon';
  $direccion='Laprida 785';
}
echo "{
  'nombre':'$nombre',
  'apellido':'$apellido',
  'direccion':'$direccion'
}";
?>

Cuando se presiona el botón submit procedemos a realizar la petición asincrónica utilizando la función getJSON:

 function presionSubmit()  {   
   var v=$("#dni").attr("value");    
   $.getJSON("pagina1.php",{dni:v},llegadaDatos);     
   return false;  }  

Como hemos llamado a la función getJSON la misma nos retorna un objeto JavaScript para procesarlo:

  function llegadaDatos(datos)  {   
    $("#resultados").html("Nombre:"+datos.nombre+
      "<br>"+"Apellido:"+
      datos.apellido+"<br>"+
      "Direccion:"+datos.direccion);  }  

Tengamos en cuenta que el programa en el servidor debe retornar un archivo con notación JSON:

<?php  header('Content-Type: text/txt; charset=ISO-8859-1');  
      $nombre='';  $apellido='';  
      $direccion='';  
      if ($_REQUEST['dni']=='1')  {    
           $nombre='Juan';    
           $apellido='Rodriguez';    
           $direccion='Colon 123';  }  
     if ($_REQUEST['dni']=='2')  {    
           $nombre='Ana';    
           $apellido='Maldonado';    
           $direccion='Lima 245';  }  
    if ($_REQUEST['dni']=='3')  {    
           $nombre='laura';    
           $apellido='Pueyrredon';    
           $direccion='Laprida 785';  }  
   echo "{    'nombre':'$nombre',    
              'apellido':'$apellido',    
              'direccion':'$direccion'  }";  
?>
 
 
 
 
       

¿Quienes somos?

Condiciones de uso

Publicidad

Privacidad de la informacion