How do we format an address that didn’t use the address input field to work correctly?
1 Like
You need to elaborate more with your question…
Where is this address input field that you are referring to?
What code have you used so far on your page?
Screenshots would be helpful too.
Is it in a user input form that you have created?
If so then you can add a data hook to your code in the data.js file in your backend that alters the user inputs before they are saving into the dataset.
https://support.wix.com/en/article/corvid-about-data-hooks
https://support.wix.com/en/article/corvid-using-data-hooks
https://www.wix.com/corvid/reference/wix-data.Hooks.html
https://www.wix.com/corvid/reference/wix-data.Hooks.html#beforeInsert
Wix Corvid Tutorial:
https://support.wix.com/en/article/corvid-tutorial-processing-user-input-before-it-is-stored-in-a-collection-with-data-hooks
Or is it in the Wix Stores app?
https://www.wix.com/corvid/reference/wix-stores-backend.html#Address
Or is it through the AddressInput that you use along with Google Maps?
https://www.wix.com/corvid/reference/$w.AddressInput.html
If you haven’t used any code on your page and you are just using the Wix Editor itself, then please put your issue through Wix Support instead.
https://support.wix.com/en/article/contacting-wix-support
So its the address field type in the normal non wix app database itself. I have addresses all in the same format added to the database under the address type field. The addresses were not user input but from a csv of data I collected.
I am trying to figure out how to format the address to work with the database itself. When i go to the database there is a warning on those fields that the address is not correctly formatted and I can press the button to format it. I would prefer to bot have to press the button over 10k times.
In my admin page, I am able to update all of the addresses and they look like the ones from the address input but they still get the warning that its not correct format.
So like my original question states, what “format” do they need to be in to not get that warning and be able to work with google maps?
I know that the addresses gathered via address input are an Address object that has various information in such as formattedAddress etc. i didn’t know if there was a simple way to create a new address object that gets the rest of the info filled out.
I have the sam problem, anyone that has the solution?
Same problem here using the Google Maps Geocoding API that returns the same formatted address as the Content Manager from Wix.
Is this working for anyone yet? It looks like the Wix Address Input object linked to Google is creating a JSON string, but I can’t figure out how to save it to the “address” field in the Wix Contact list.
Do I have to decode this whole thing myself to save it?
(Also, it’s putting the “state” as “subdivision”)
city: “Orlando”
country: “US”
formatted: “3057 Tradeport Dr, Orlando, FL 32824, USA”
location: Object { latitude: 28.411084, longitude: -81.34604999999999 }
postalCode: “32824”
streetAddress: {…}
name: “Tradeport Dr”
number: “3057”
: Object { … }
subdivision: “FL”
People, I solved it! I just haven’t got the time to post it here. Here is the thing, the Address Database Field is a JSON, so to save it to your dataset you need to format it as a JSON.
First I created an object as a container to format the address:
function createNewAddressObject(obj) {
let { address_components } = obj // extract the address_components property of the JSON
let fullAddress = { // this is the JSON object that is going to be pushed to the database
city: "",
location: {
latitude: obj.geometry.location.lat,
longitude: obj.geometry.location.lng
},
streetAddress: {
name: "",
number: ""
},
formatted: obj.formatted_address,
country: "",
postalCode: "",
subdivision: ""
}
for (const prop in address_components) {
if (address_components.hasOwnProperty(prop)) {
const element = address_components[prop];
if (element.types.includes("administrative_area_level_2")) fullAddress.city = element.short_name
else if (element.types.includes("route")) fullAddress.streetAddress.name = element.long_name
else if (element.types.includes("postal_code")) fullAddress.postalCode = element.short_name
else if (element.types.includes("administrative_area_level_1")) fullAddress.subdivision = element.short_name
else if (element.types.includes("country")) fullAddress.country = element.short_name
else if (element.types.includes("street_number")) fullAddress.streetAddress.number = element.short_name
}
}
return fullAddress
}
And then I push the object fullAddress (as newAddressObject that I used as a variable to store the return from the function) to the dataset:
async function createNewCostumerAndInsert() {
let newCostumer = createNewCostumer(
$w("#inputNewCostumerName").value,
$w("#inputNewCostumerCPF").value,
newAddressObject, // here it is.
$w("#datePickerNewCostumerBday").value,
$w("#inputNewCostumerAddComplement").value,
$w("#inputNewCostumerEmail").value,
$w('#inputCellphone').value
)
newCostumerId = await insertNewCostumer(newCostumer)
if (newCostumerId) {
$w('#textAlertNewCostumer').text = "Usuário inserido com sucesso!"
$w('#textAlertNewCostumer').text.style.color = '#BADA55'
$w('#textAlertNewCostumer').show()
$w('#sectionNewCostumer').collapse()
$w('#sectionNewOrder').expand()
$w('#inputCostumer').value = newCostumer.name
} else {
console.log("Usuário não inserido!")
}
}
Thanks Bruno! When calling the createNewAddressObject() method, should I be passing in the actual AddressInput object from the form or the value?
createNewAddressObject( $w(‘#myAddressInput’) )
or
createNewAddressObject( $w(‘#myAddressInput’).value )
?
Hello Christopher, this function that I created is to format the JSON you get from the Google API.
Here is the backend call to the Google API:
import { fetch } from 'wix-fetch'
const baseURL = "https://maps.googleapis.com/maps/api/geocode/json?"
const country = "BR"
const key = "your_API_key"
export function autocomplete(query) {
let url = baseURL + "address=" + query + "&components=country:" + country + "&key=" + key
return fetch(url, { method: 'get' }).then(httpResponse => {
if (httpResponse.ok) {
return httpResponse.json()
}
})
}
I call it through this command after any user input:
let query = await autocomplete(val) // val being your $w('#myAddressInput').value
This query result is the Google JSON that you have to pass through the function to format it, otherwise the database will not accept it:
let newAddressObject = createNewAddressObject(obj) // obj being the JSON, in this case you can use the query variable that was created.
let newAddressObject = createNewAddressObject(query) // like this
If you have any doubt, just let me know.
I do have the same problem as decribed by Patrick.
As I am a beginner I don’t really understand the procedure/code described by Bruno.
Is there no simple way, where I can format the address already in the correct way in my Excel/CSV file? This would make things a lot easier for me.
Any help is highly appreciated.
Try saving the address in this format, inside your Excel file:
{
"city": "New York",
"location": {
"latitude": 40.7558611,
"longitude": -73.987061
},
"streetAddress": {
"number": "",
"name": "",
"apt": ""
},
"formatted": "New York, NY 10018, USA",
"country": "US",
"postalCode": "10018",
"subdivision": "NY"
}