I'm working on a QR project where upon scan, the user is navigated to a webpage where their location parameters are passed. It will then query an html table for the appropriate crisis line phone number and launch the phone dialpad using javascript: window.open('tel:5555555555'). This function works in the browser console with no issues, but for some reason it is not working when the web page is published. It successfully queries the table, returns the correct location and phone number which I log, but it doesn't open the phone dialpad at all. That's the only part that's missing. Does anyone know why this might be?
LaunchCrisisLine();
function LaunchCrisisLine() {
//get URL - location params
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const location = urlParams.get('location');
console.log(location);
// Declare variables
var input, filter, table, tr, td, i, txtValue;
input = location;
if(input != null){
filter = input.toUpperCase();
table = document.getElementById("crisisLineTable");
tr = table.getElementsByTagName("tr");
// Loop through all table rows, and hide those who don't match the search query
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
td2 = tr[i].getElementsByTagName("td")[2];
if (td) {
txtValue = td.textContent || td.innerText;
crisisLine = td2.getElementsByTagName('a')[0].href;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
window.open(crisisLine);
} else {
tr[i].style.display = "none";
}
}
}
}
}