[SOLUCIONADO] Leer un json desde una url y no desde un archivo

yafuslae · #1 (**permalink**) 15/10/2013, 11:55

Hola.
Estoy intentando coger un json desde una url (http://pere.bocairent.net/z39.php?title=caballos) para después pasarlo a un objeto de javascript.
Después de mucho buscar solo encuentro soluciones de pasar de archivo json a objeto javascript pero nada de coger directamente ese contenido json de una url para convertirlo después.
¿De que manera podría?

PHPeros · #2 (**permalink**) 15/10/2013, 12:06

Te refieres a parsearlo?

https://developer.mozilla.org/en-US/...cts/JSON/parse

yafuslae · #3 (**permalink**) 15/10/2013, 14:30

Lo que intento hacer es, bueno... si, parsearlo pero no proviniendo de un archivo .json, si no desde una url. Sería obtener los datos de la url antes mencionada para tratarlo posteriormente.

caricatos · #4 (**permalink**) 15/10/2013, 16:42

Hola:

Revisa nuestras FAQs que yo mismo puse como recibir datos por url...

Saludos

yafuslae · #5 (**permalink**) 15/10/2013, 17:43

Me dirás de todo, pero no encuentro exactamente en que parte de las FAQs está. Este sitio es enorme y ni con el buscador.

caricatos · #6 (**permalink**) 16/10/2013, 00:12

Hola:

Este es el mensaje: ¿Como recoger Datos por url?.

Saludos

yafuslae · #7 (**permalink**) 16/10/2013, 04:40

No es exactamente eso lo que digo. Lo que dices tú parece como que es para recoger datos de la dirección url. Yo a lo que me refiero es a de una pagina web en concreto coger los datos que hay en formato json y ya luego según se, convertirlos en un objeto de javascript con eval. La url es http://pere.bocairent.net/z39.php?title=caballos . Mírala si quieres hacerte una idea de lo que quiero extraer.

quimfv · #8 (**permalink**) 16/10/2013, 06:34

http://www.w3schools.com/jquery/ajax_getjson.asp

jquery... no es que sea de mi admiración...

Código Javascript:

Ver original<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $.getJSON("http://pere.bocairent.net/z39.php?title=caballos",function(result){
      $.each(result, function(i, field){
        $("div").append(field + " ");
      });
    });
  });
});
</script>
</head>
<body>
 
<button>Get JSON data</button>
<div></div>
 
</body>
</html>

yafuslae · #9 (**permalink**) 16/10/2013, 06:45

Ups! Olvide comentar que no me dejan gastar jquery.

PHPeros · #10 (**permalink**) 16/10/2013, 07:11

Estás usando ajax???

No se ni que preguntar

yafuslae · #11 (**permalink**) 16/10/2013, 07:27

Ajax si que podría usar. Pero nada de jquery, mootols o similares.

PHPeros · #12 (**permalink**) 16/10/2013, 07:34

Esque tienes que usar ajax si o si. Léete esto:

http://falcon80.com/JSON/JSONandAJAX.html

Y si tienes dudas nos comentas.

yafuslae · #13 (**permalink**) 16/10/2013, 08:47

¡Funciona!

Con el código siguiente va perfecto:

Código:

<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<script type="application/javascript">
function loadJSON()
{
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{

// Parse the JSON data structure contained in xmlhttp.responseText using the JSON.parse function.
var JSONObject = JSON.parse(xmlhttp.responseText);

// The JSONObject variable now contains the data structure and can be accessed as JSONObject.firstName and
// JSONObject.lastName. Assign the object members to the DOM elements FirstName and LastName so that they get
// displayed on the page
document.getElementById("FirstName").innerHTML = JSONObject.language;
document.getElementById("LastName").innerHTML = JSONObject.isbn;
}
}
xmlhttp.open("GET","http://pere.bocairent.net/z39.php?title=caballos",true);
xmlhttp.send();
}
</script>

<title>JSON and AJAX</title>
</head>
<body>
<div id="FirstName">Prince</div>
<div id="LastName">Vivian</div>
<button type="button" onclick="loadJSON()">Update Name</button>
<h2>Click this button to update the page</h2>
</body>
</html>

GET READY TO THE NEXT FIGHT!
Gracias a todos. Marco como solucionado.