Can't get the json value by getjson from google map api
HTML
<html>
<head>
</head>
<body>
<input data-mini="true" data-theme="a" id="search" name="search" placeholder="Search for Restaurants" type="search">
<input data-inline="true" id="submit" onclick="getRestaurants()" type="submit" value="Go">
</body>
</html>
JS
function getRestaurants()
{
var search=$("#search").val();
var prestring="restaurant+in+";
var jsonRList="https://maps.googleapis.com/maps/api/place/textsearch/json?query="+prestring+search+"&key=API_KEY";
var xmlRList="https://maps.googleapis.com/maps/api/place/textsearch/xml?query="+prestring+search+"&key=API_KEY";
alert(jsonRList);//working
//NOT working
$.getJSON(jsonRList, function (data) {
alert(data.results[0].name);//returns nothing
alert("hello2");//returns nothing
});
//working
var data = '{"name": "abc","age": 30,"address": {"streetAddress": "88 8nd Street","city": "New York"},"phoneNumber": [{"type": "home","number": "111 111-1111"},{"type": "fax","number": "222 222-2222"}]}';
var json = JSON.parse(data);
alert(json.phoneNumber[0].number);
alert("hello3");//working
//NOT working
$.ajax({
url: 'https://maps.googleapis.com/maps/api/place/textsearch/json?query=kolkata&key=API_KEY',
dataType: 'jsonp',
success: function(data){
alert(data);//returns nothing
alert("ajax");//returns nothing
}
});
alert("hello4");//working
//Not working
$(document).ready(function(){
$("submit").click(function(){
$.getJSON( jsonRList, function( data ) {
alert(data);//returns nothing
alert("hello5");//returns nothing
});
});
});
}
Inside $.getjson or $.ajax not executing anything.
Another approach that is not working
$("button").click(function() {
....
