Address Hyperlink on dynamic page

Ask the community
,
1

Hello,
I wanted to have an address from my database be clickable once connected on a page.

To sum it up I will be listing places and want the user to “map it” by clicking the link and it taking them to the “google maps” page with the location up. I know how to do this with just a few locations by going to google maps them putting in the address and then taking the embedded link and using that as a url but I do not want to have to manually do this for thousands of locations.

Thanks

2

Hi, If what you’re trying to do is have one map showing a single point at a time you can use the $w.GoogleMaps .

If you need multiple locations to be shown on the same map, use it in an iframe and use postMessage to deliver the points to it.
See here about working with iframes.

Liran.

3

Hi - I need it to be automated and this looks to be manual fields for the longitude latitude…

What I need is this.

  • Address is imported into database
  • Address is show on dynamic page (1000s of locations will be listed)
  • Address has a hyper link
  • When clicked user is taken to google maps for location
4

Sounds even more easy.
I’ll give you a short and clear skeleton to work with.

If you know how to create a URL for the map, lets say something like:
’ https://www.google.com/maps/search/?api=1&query=m anhattan '.

and assuming your database has two fields:
TITLE: ADDRESS (address):
M&Ms shop Manhattan

So on the dynamic page, instead of having the address as a text, use it as a button (design it to look however you want) and connect the label to the address or title field.
Then, in code, use $w.onReady to set the url:

const prefix = 'https://www.google.com/maps/search/?api=1&query=';
$w.onReady(function(){
    $w('#dynamicDataset').onReady(() => {
       const currentItem = $w('#dynamicDataset').getCurrentItem();
       $w("#button1").link = prefix + currentItem.address;
    });
});

Hope this helps,

Liran.

5

I may be missing something but what do I put in replace of #dynamicDataset? It says not a valid selection and I changed to the name of my database and still generating an error… I was able to change the #button to the correct label

6

706×147 20.5 KB

7

I get the errors for line 3 and 4 not a valid selector name … It does the same thing if i use “#dynamicDataset”

8

You said that you have this in a dynamic page, this means that you have a dataset for the dynamic page.
This is the one you need to use in your code.

9

Hi Liran,

Thanks for getting back to me… Another Wix person was able to help with this yesterday… However, the one thing I am trying to figure out now is how to have it “map” each location from the repeater… It only maps the very first cell from my database under address column…

10

Hi Michael,
Try to combine onItemReady method of Repeater’s element.
Check out this reference for examples.
Roi.