Home > Net >  trying to change iframe location from javascript
trying to change iframe location from javascript

Time:05-11

i have many stores every store got latitude, longitude when i click location icon for any store i send latitude, longitude to javascript function and change iframe src in js function and i show model showing the iframe but the iframe not showing the location here is the code.

iframe error www.google.com refused to connect.

icon button <a onclick="getLocation({{$store->lat}},{{$store->lon}})" data-toggle="modal" href="#edit_location"><i style="font-size: 25px; color: #009688;" ></i></a>

iframe in model

<div ><div ><iframe  id="gmap_canvas" src="" frameborder="0" scrolling="no" style="width: 100%; height: 400px;"></iframe><a href="https://fnftest.net" style="display:none">fnf test playground remake</a><style>.mapouter{position:relative;text-align:right;height:400px;width:100%;}</style><a href="https://www.googlemapsiframegenerator.com" style="display:none">Google Maps Iframe Generator - Free Html Embed Code</a><style>.gmap_canvas{overflow:hidden;background:none!important;height:400px;width:100%;}</style></div></div>

javascript function

function getLocation(lat,lon){
    var loc = document.getElementById('gmap_canvas');
    loc.src = 'https://maps.google.com/maps?q='   lat   ','   lon   '&hl=es;z=14&amp;output=embed';
}

Note when i give iframe src any static location without js it works the problem when i change the src from js the error show

CodePudding user response:

Where is your JS function located - I am assuming it is in an external script resource, and not directly contained inside the HTML document?

loc.src = 'https://maps.google.com/maps?q='   lat   ','   lon   '&hl=es;z=14&amp;output=embed';

Replace the &amp; with a single & then. Encoding this as &amp; would only be necessary, if the context was HTML - but that is not the case, if this code resides in an external JS resource.

Google does give me the "connection refused" message when I try to use this URL with &amp; (more precise, the browser said it has X-Frame-Options set to Deny), but it appears to work fine with just &.

  • Related