Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
    Omer Eldar
    Hey, I wanted to know if there was any way to pass in the api key through the react component rather than loading it as a script
    Would make my life a lot easier as we use one key for dev and one key for prod which is limited to our production url

    Hey everyone. I saw that after passing out location from DropDown and Submitting it. In Console ( Network ) you are getting response with "formatted_address".
    Does anyone knows how to access this response and store it in the project?
    The idea is that when user types data. It store lat lng and stores address + zip code.

    handleSelect = address => {
          .then(results => getLatLng(results[0]))
          .then(latLng => console.log("Success", latLng))
          .then(() => this.setState({ storedAddress: address }))
          .catch(error => console.error("Error", error));

    But in the example about storedAddress will not return formatted address. Meaning it will not contain zip.

    Sakul Budhathoki
    searchOptions = {{ types :['cities']}} not working , throws Invalid request from Google maps api, what might be a problem here.
    Max Chernin
    hi guys
    how are you handling vaidation for this?
    Max Chernin
    hello all
    is there a way to clear all suggestion when i get "zero results" error?
    Aymen Fezai
    How to reverse geocoding? I mean how to get the name of the place from the lng and lat
    Nikola Mitic

    Hey Humans! First ever gitter room for me, glad to find you here!

    Is there any example where react-places-autocomplete is used with react-final-form? And does it even make sense to use those two?

    Andrei Fiodorov
    Hello all
    I have a question. Im adding in searchOptions = { fields: ['photos','formatted_address','name','rating','opening_hours','geometry'] }
    but not return photo_reference
    Volodymyr Kotuslyi
    I want to add sessionToken support for getPlacePredictions
    Dj Steinmetz
    @afiliptsov Had the same issue! For that, I just re-ran the geocodeByAddress(address) function, and instead of running the method getLatLng(), I simply set state at that point (in the second instance of the function).
    handleSelect = address => {
                .then(results => getLatLng(results[0]))
                .then(latLng => {
                    console.log('Success', latLng)
                        latLng: latLng,
                        // address: address
                .catch(error => console.error('Error', error));
                .then(results => this.setState({address: results[0].formatted_address}))
                .catch(error => console.error('Error', error));
    just wondering is anyone here using typescript
    i think the types are outdated
    Can i restrict by country a code
    Brian Simmons
    Does anybody have a good reference for testing the places-autocomplete component with enzyme?
    Marco Arduini

    Hi, I'm also testing an application which uses react-places-autocomplete with cypress.

    The test is able to search for a city and select one of the results and it works fine in local, since it hits the real google geolocation service.

    Unfortunately, it does not work in CI because it's prevented from sending requests to external services. I have been trying to stub the request for some time with little success. Any suggestions?

    vidur singla
    Guys can someone help me to clear autocomplete api


    Can anyone suggest how to integrate the react-places-autocomplete with react select?

    Hi, i need some help
    Screenshot 2019-06-11 at 18.52.38.png
    Hi all!
    I’ve got an error when test with Jest after using this package.
    TypeError: request.open is not a function
        at dispatchXhrRequest (.../node_modules/axios/lib/adapters/xhr.js:28:13)
        at new Promise (<anonymous>)
        at xhrAdapter (.../node_modules/axios/lib/adapters/xhr.js:11:10)
        at dispatchRequest (.../node_modules/axios/lib/core/dispatchRequest.js:59:10)
        at <anonymous>
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! my-project@0.1.0 test: `node scripts/test.js --env=jsdom`
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the my-project@0.1.0 test script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
    Jest testing was working well before using this package.
    I need help to fix this issue ASAP
    Hi all!
    how can i get the postal code of address?
    I've opened up a PR to add some missing test coverage: hibiken/react-places-autocomplete#283
    Kareem Khattab
    is there a way to require an exact address?
    so more granular than city,state,country
    Anirudh Prasad
    im not gettting the true values in reponse while entering zipcode, like 10003. Any idea......
    Above is the results im getting
    while searching same on google map, it shows above results
    Examples on github or npm
    are using css classes like className="autocomplete-dropdown-container"
    where is css file to use?
    Is this a totally dead community?
    Javier Couce Langa
    I hope it's not, the CSS files are not available you can design your own :(.
    I am trying to keep the results even when the input is not focused, anyone has an idea to do so?
    Javier Couce Langa
    Just pass a reference prop:
    ref={(ref) => { if (!ref) return; ref.handleInputOnBlur = () => { }; }}
    Bhumi Sukhadiya
    searchOptions are not working in my case.
    I need name field also in selected address object
    but i am not able to get it.
    What is the issue?