Parse variables from json url using jQuery

Question

How I can parse parameters like "city" from json?

I have url like this: http://api.db-ip.com/addrinfo?addr=8.8.8.8&api_key=key, this return me this:

{
    "address":"8.8.8.8",
    "country":"US",
    "stateprov":"California",
    "city":"Mountain View"
}

I want to apply city (or country) variable to <input type>, to show visitors some info about location.

Can you check what errors are there in the console (F12). If I'm correct, there should be an error saying that you can't do cross-domain AJAX. db-ip doesn't seem to have CORS nor JSONP. — Joseph
– Joseph, Commented Sep 16, 2013 at 15:57
Yes, I get this error: is not allowed by Access-Control-Allow-Origin. — loadaverage
– loadaverage, Commented Sep 16, 2013 at 16:16

mjk · Accepted Answer · 2013-09-16 16:22:12Z

1

If you just want to load that JSON object and access the "city" field, use jQuery's getJSON method to get a native JS object in response.

$.getJSON( "http://api.db-ip.com/addrinfo?addr=8.8.8.8&api_key=key", function(data) {
   // do something with data.city;
});

However, in your case, you're trying to make a cross-domain JSON request -- not allowed. Since db-ip.com doesn't allow it, you'll have to proxy the request using PHP.

Set up "dbip.php" on your server as a proxy (cf. http://jquery-howto.blogspot.com/2009/04/cross-domain-ajax-querying-with-jquery.html)

Then you just load JSON from dbip.php on your own server, which queries db-ip.com for you. The browser is happy because the AJAX request it makes doesn't cross domain names.

edited Sep 16, 2013 at 16:22

answered Sep 16, 2013 at 15:28

mjk

2,4514 gold badges34 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

loadaverage Over a year ago

I'm trying to get city value from this json in to input field (for form).

mjk Over a year ago

Does your input field have a specific ID? e.g. <input id="city"/> If so, you'd just do something like $('#city').val(data.city) inside that function block.

loadaverage Over a year ago

Yes, I've trying this: ` <input type="text" id="city"/> <script type="text/javascript"> $.getJSON( "api.db-ip.com/addrinfo?addr=8.8.8.8&api_key=key", function(data) { $('#city').val(data.city); }); </script> `

loadaverage Over a year ago

But can't get value city.

mjk Over a year ago

I just noticed the comment above (that you're loading cross-domain AJAX). You can't make a direct JSON request from another domain. JSONP is a simple cross-browser solution (loading a script tag that contains the desired response, wrapped in a call to your chosen method) if there was a supported JSONP endpoint at db-ip.

|

İbrahim Altınoluk · Accepted Answer · 2013-09-16 15:25:10Z

0

var response={
 "address":"8.8.8.8",
 "country":"US",
 "stateprov":"California",
 "city":"Mountain View"
};
$("#city").val(response.city);

answered Sep 16, 2013 at 15:25

İbrahim Altınoluk

1525 bronze badges

5 Comments

loadaverage Over a year ago

Cool, but how I can get 'responce' from url?

İbrahim Altınoluk Over a year ago

if url return type is json ,you can get that with ajax.

loadaverage Over a year ago

Could you please tell me how I can to this?

İbrahim Altınoluk Over a year ago

i think you are running html on file system. you should try localhost or web.

loadaverage Over a year ago

No, I run this from running web server. I mean, your example works perfect. But in my case (using dp-ip.com) I have cross-domain issue.

Collectives™ on Stack Overflow

Parse variables from json url using jQuery

2 Answers 2

9 Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related