Button not working in infowindow

Created on 14 April 2023, about 1 year ago

Problem/Motivation

I'm trying to include a button or input (type="button") in an infowindow that calls a simple JavaScript function that detects the browser location, then opens the get directions page in Google maps, eliminating the additional steps of having to manually click the Get directions link and entering a location to get directions. I thought this would be straight forward but I cannot get the button to work.

Steps to reproduce

Create a location on the map with a button in the infowindow. Clicking the button should call a function to open a new window in Google maps but when clicking the button nothing happens.

If the button is in the body text of a node it works, but in the infowindow it does not.

Is there something about the infowindow that blocks a button from working?

This is my JavaScript code that works with the button in the body text of a node. I still need to clean up the url but this works for now. I'm not a developer so my coding skills are limited.

var dirUrl = "https://www.google.com/maps/dir/";
const btn = document.querySelector("#get-directions");
btn.addEventListener("click", function() {
  let title = document.getElementById("distillery-name").innerHTML;
  navigator.geolocation.getCurrentPosition(addPosition);
  function addPosition(position) {
   location.href = dirUrl + position.coords.latitude + "," + position.coords.longitude + "/" + title;
}
πŸ’¬ Support request
Status

Active

Version

3.12

Component

Javascript General / Frontend

Created by

πŸ‡¨πŸ‡¦Canada jmoruzi Brantford, ON

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.69.0 2024