CODEWITHSUNDEEP
htmliosiphoneiframe
Stacknerd
Stacknerd

Reputation: 469

Mobile links in an Iframe and IOS

I was trying today to open a mobile link from one of my webapp that runs in an iframe (same domain).

It looks like these links aren't recognized by apple ?

https://plnkr.co/edit/9Rp87NcVi9Kr4MGDgIwL?p=preview

Body file

<html>
    <body>
        <a href="tel:1-888-888-1212">1-888-888-1212</a>
        <iframe src="iframe.html"></iframe>
    </body>
</html>

iframe.html

<body>
    <a href="tel:1-877-877-2323">1-877-877-2323</a>
</body>

In the following plunkr i made a little example of that. My Local computer can recognize those links, both, and so does my multiple android devices. Although when it comes to IOS, nothing to be done about it, it will only work for the link that is not in an Iframe.

Anybody had a simillar problem and or knows a solution to this issue ?

Upvotes: 2

Views: 3992

Answers (1)

Sanova
Sanova

Reputation: 541

By using a script to select the parent document from the iframe, it should work. try this:

edit Adding "target="_parent" to the anchor is the solution for those viewing this answer.

Dated answer:

<iframe  id="test" src="iframe.html"></iframe>
<script>
var iframe = document.getElementById("test");
var iDoc = iframe.contentDocument;
iDoc.write('<a target="_parent" href="tel://1-888-888-1212">1-888-888-1212</a>');
</script>

Upvotes: 3

Related Questions