How can I retrieve the Google Maps URL containing a 'placeid' using AJAX?

I have a specific URL that I can access through my browser to see JSON data. The URL appears as follows:

https://maps.googleapis.com/maps/api/place/details/json?placeid=ChIJZeH1eyl344kRA3v52Jl3kHo&key=API_KEY_HERE

However, when I attempt to use jQuery AJAX to retrieve this information, I encounter an error instead of receiving the desired results.

This is what my AJAX request looks like:

   $.ajax({
       url: https://maps.googleapis.com/maps/api/place/details/json,
       data: {
           'placeid': 'ChIJZeH1eyl344kRA3v52Jl3kHo',
           'key': 'API_KEY_HERE'
       },
       dataType: 'json',
       success: function(response) {
           alert(JSON.stringify(response));
       },
       error: function(error) {
          alert(JSON.stringify(error));                                                               
       }
   });

Answer №1

var API_KEY = api_key;
var placeid = placeid;
var API_URL = `https://maps.googleapis.com/maps/api/place/details/json?placeid=${placeid}&key=${API_KEY}`

$.getJSON(API_URL, {
        tags: placeid,
        tagmode: "any",
        format: "json"
    },
    function(data) {
        alert(data);
    });

If I put together this code properly, it should correctly send data to the api by using the placeid within the url string along with the api_key.

Instead of using json, you are utilizing getJSON which suggests that you are looking to retrieve the place data. This is assuming based on your use of ajax.

If you can provide more details about what you mean by

how to get google maps url with place id
, I can offer further assistance. Hope this explanation helps you out :)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Searching for data in a JSON file and retrieving values from an array using Python

Looking at the JSON provided below, my goal is to search each array and extract data only from the ones that have keys and values in the "source" block. Arrays with an empty "source" block should be disregarded. Here's the JSON structure: { "L": [ ...

Node API is failing to insert user data into MongoDB

I'm currently developing a Restful API using Node.js and storing data in Mongodb, focusing on the user registration API. app.js apiRoutes.post('/signup', function(req, res) { if (!req.body.name || !req.body.password) { res.json({suc ...

Comparison between on() delegation and delegate()

When using <strong>$(document).on('click', '#target')</strong> versus <strong>$('body').delegate('click', '#target');</strong> It seems like both options achieve the desired outcome ...

Tips and techniques for implementing push notifications in front-end applications without the need for a page refresh

I am working on a Python program that inserts data into a XAMPP database. I am looking for a way to continuously monitor the database for any changes and automatically send updates to the frontend without relying on click events. Is there a method simila ...

Choosing bookmarkable views in Angular 5 without using routes

I'm currently working on a unique Angular 5 application that deviates from the standard use of routes. Instead, we have our own custom menu structure for selecting views. However, we still want to be able to provide bookmarkable URLs that open specifi ...

Utilizing jQuery to Uppercase the Ajax Attribute

Lately, I've encountered an issue where I need to format the text input before sending it to ajax and saving it in the database. Specifically, I want to convert the text to lowercase and then capitalize the first letter before storing it. Here's ...

Emailer: Missing Salutation

While attempting to send emails using Node with Nodemailer (https://github.com/nodemailer/nodemailer), the sendMail call from the Nodemailer transporter is throwing an error message of Greeting never received when connected to an Ethereal test email accoun ...

Adding items to a JSON document

My task involves creating a pseudo cart page where clicking on checkout triggers a request to a JSON file named "ordersTest.json" with the structure: { "orders": [] }. The goal is to add the data from the post request into the orders array within the JSO ...

Problem with Array Serialization

I have a situation where I am serializing information using jQuery and storing it in a MySQL database: $(function () { $("#sortable").sortable({ stop: function (event, ui) { $("#q35list").val($(this).sortable('serialize') ...

Navigational elements, drawers, and flexible designs in Material-UI

I'm working on implementing a rechart in a component, but I've encountered an issue related to a flex tag. This is causing some problems as I don't have enough knowledge about CSS to find a workaround. In my nav style, I have display: flex, ...

Assertion using Node.js with Selenium WebDriver

I am currently working on implementing assertions for testing using selenium webdriver with node js. However, I am encountering an issue where it returns undefined when trying to assert the page title (which is the URL of the page). It seems like I may n ...

A guide to handling Ajax Data using Python (Django)

Looking to send front end data (Form inputs) to the server using Ajax. However, encountering some difficulties with handling errors in Python during the initial attempts. Below is the Ajax call: //Get journey time for the stated address jQuery.ajax({ ...

What is the best way to execute a PHP query using JQuery and Ajax?

I need assistance with a two-column layout where the first column contains draggable words and the second column is dropabble, allowing words to be moved between columns. How can I save this transition in my database table effectively? Currently, I am uti ...

Displaying AJAX search results

Seeking assistance, I am facing a dilemma with the data I loaded via ajax. I am unsure about how to input the item code and generate the data in JSON format into the table. View <div class="form-group col-md-4"> <label for="field-1" class="c ...

Can the MemoryRouter be successfully nested within the BrowserRouter in a React application?

I've been on a quest for some time now, trying to uncover whether it's feasible to utilize MemoryRouter solely for specific routes while maintaining the use of BrowserRouter in general. My goal is to navigate to a particular component without alt ...

Utilizing Material-UI Select for creating a number range dynamically

Seeking a solution to create a select element using material-ui that offers a range of numbers from 0 to 20,000,000 in increments of 25,000. Currently, I have accomplished this using a for loop. for (let price = 0; price <= 20000000; price = price + 250 ...

How can I place an Object in front of an Array in JavaScript?

Currently, I am working on an Angular project where I need to modify a JSON array in order to display it as a tree structure. To achieve this, the objects in the array must be nested within another object. Desired format / output: this.nodes = [ { id ...

Unable to retrieve image

I want to save a Discord user's profile picture on Replit, but even though it downloads successfully, the image is not displaying. Here is the code I am using: const request = require('request') const fs = require('fs') app.get(&qu ...

Unable to retrieve data from the database within PHP code

I have successfully built a shopping cart website utilizing SQL, HTML, and PHP. Below is the code snippet for the 'Add to Cart' button: <form method="post" action="cart.php" class="form-inline"> <input type="hidden" value="&apos ...

Concealing a form after submission using JavaScript

After submitting the form, I am attempting to hide it and display a loading GIF. I've experimented with various methods, including changing ClassName to Id, but haven't had success. This is for a school project, and I've spent a significant ...