Search code examples
javascriptcordovaphonegap

How to use iframe in phonegap project?


I have created a phonegap project. In this project there is a page with a button integrated. This button refers to an url ("InAppbrowser: True").

I would like to integrate an iframe instead of a redirection.

I already tried:

<iframe src="http://www.example.com/" style="width:100%; height:100%;">

Unfortunately I don't know exactly how and where to use it.

(This is a .js file and it is under the following path app/module/custom/example.js)

example.js (code snippet) 

       content['iframe'] = {
          theme: 'button_link',
          text: 'register',
          path: 'https://www.google.de/',
          options: {
              iframe: true,
              //InAppBrowser: true
            }
       };

Solution

  • <div id="QR" data-role="view" data-model="Your data model name"></div>
    

    Please above code put in your HTML file

    Then Below code put in your click button event

    //Append iframe 
    $("#QR").find(".view-content").append('<iframe id="ifrQR" src="" target="_parent"></iframe>');
    var iFr1 = document.getElementById('ifrQR');
    iFr1.src = "http://www.google.in";
    var $if1 = $("#QR").find("#ifrQR");
    $if1.load(function () {
         alert("iframe loaded");
    });