Question:
Text box needs to show Country, State and City from Google Location object field in collection
Product:
Wix Editor
What are you trying to achieve:
I want a text box & a collapsible text box to show Country, State & City values from a collection’s Address field (Google Location object)
What have you already tried:
Something like the following was used in a different use case, to retrieve such values for a dropdown
async function getCities() {
const state = $w("#statesDropdown").value;
const listingsQueryResult = await wixData.query("Properties")
.eq("mapLocation.subdivision", state)
.distinct("mapLocation.city");
return listingsQueryResult.items;
}
import wixData from 'wix-data';
$w.onReady(async function () {
const result = await wixData.query("test").find();
if (result.items.length > 0) {
const item = result.items[0];
const location = item.object;
if (location) {
const country = location.country;
const state = location.subdivision;
const city = location.city;
$w("#countryTextBox").text = `Country: ${country}`;
$w("#stateTextBox").text = `State: ${state}`;
$w("#cityTextBox").text = `City: ${city}`;
}
}
$w("#expandButton").onClick(() => {
$w("#collapsibleBox").expand();
$w("#expandButton").hide();
$w("#collapseButton").show();
});
$w("#collapseButton").onClick(() => {
$w("#collapsibleBox").collapse();
$w("#collapseButton").hide();
$w("#expandButton").show();
});
});
just replace object in ‘item.object’ with the id of the object field in your collection. As well as the field names (country, state, city) to make sure they match your object. In my example I used country, city, subdivision.
Confirmed it pulled the location data from the collection successfully:
