0

What I have and I need to do it work properly is when I'm in a "start page" and I click a button like this:

PAGE-1 

<a href="/PAGE-2/" data-iframe-src="http://myappwebsite/resourcesiframe?shopId=3366&type=image&max-levels=1&point=A" class="map-button">Point A</a>

It should send me to "another page" where I load dinamically an iframe taking each variable (shopID, type, max-levels and point) from the URL and print it like an iframe this way:

PAGE-2

<iframe id="frame" src="http://myappwebsite/resourcesiframe?shopId=3366&type=image&point=A" width=“XXX" height=“XXX"></iframe>

I've used this javascript snippet but anyway, I can't make it work properly at all. 

$(".map-button").click(function (e) { 
e.preventDefault(); 
$("#frame").attr("src", $(this).attr('data - iframe - src'));
});

I only need to get the variables from the data-iframe-src and use them in the iframe, but I'm not able... The problem is that I load elements in different pages, so I don't know how this affect to the URL variables.

Cœur
  • 37,241
  • 25
  • 195
  • 267
Roberto Meijide
  • 99
  • 19
  • Possible duplicate of [How to get the value from the GET parameters?](https://stackoverflow.com/questions/979975/how-to-get-the-value-from-the-get-parameters) – CBroe Jan 29 '18 at 13:12
  • You can't affect an element on a new page that hasn't even loaded within the click handler. When new page loads it is a whole new window instance and knows nothing about the script in previous page – charlietfl Jan 29 '18 at 13:21
  • Do you actually need to read any query string parameters here, or do you just need to load the URL given in the `data-iframe-src` attribute into the iframe directly? (You say you wanted to take over `max-levels` as well, but then your example leaves that parameter out.) – CBroe Jan 29 '18 at 15:41
  • @CBroe I need to load the URL given in the `data-iframe-src` into the iframe directly. But this is my aproach, I don't know if the best way is with `data-iframe-src`. This is an attribute I use in my PAGE-1 button to send attributes to the PAGE-2. And `max-levels` parameter is out in this example because it's not important for now. – Roberto Meijide Jan 29 '18 at 15:48
  • _“And max-levels parameter is out in this example because it's not important for now”_ - but it changes the whole scope of the question, so please try and be precise in such regards next time! // As @charlietfl already said, it can’t work this way, you have a logic issue here. When you follow the link to `/PAGE-2/`, then your browser would load that page, and therefor your `a` element that you want to read the `data-iframe-src` attribute value from, doesn’t even exist any more. – CBroe Jan 29 '18 at 15:53
  • You need to either stay on the current page (which also contains your iframe), or you would need to pass this value over to a “different page” some other way first, for example as a GET parameter, so that you could then read that from inside page 2 ... – CBroe Jan 29 '18 at 15:53
  • @charlietfl so it's impossible to call a PAGE-2 from PAGE-1 sending a parameter from PAGE-1 to insert it into an iframe in PAGE-2? – Roberto Meijide Jan 29 '18 at 15:55
  • 1
    No it's not impossible if you use url parameters and read those on new page as @CBroe pointed out. Or you could store values in localStorage and read from there. Both require you to assign the iframe src from inside the secong page code – charlietfl Jan 29 '18 at 15:58

1 Answers1

0

I've founded a simple solution for my problem here and it works for me.

First of all I put this simple iframe in my PAGE-2:

<iframe id="frame" src="" width="100%" height="auto" frameborder="0" scrolling="yes"></iframe>

Then in PAGE-1 I've used this type of links:

https://myappwebsite/page-2?shopId=1234&type=image&max-levels=1&point=A

So now my PAGE-2 loads properly with these params in the URL. Then I've used this simple snippet in Javascript to fill my iframe in PAGE-2:

<script type="text/javascript">
    $( document ).ready(function() {
        $("#frame").attr("src", "https://myappwebsite/resourcesiframe" + window.location.search);
    });
</script>

And it works! Now I can go to PAGE-2 with all my params, pick them and use them in SRC inside the blank iframe.

Thanks for getting me in the correct path!

Roberto Meijide
  • 99
  • 19