Phonegap build - Open external page in InAppBrowser or childbrowser with no toolbar and close it?

Claes Gustavsson picture Claes Gustavsson · Mar 27, 2013 · Viewed 22.5k times · Source
  1. I want to open an external page in the InAppBrowser or childbrowser, where I don't show any toolbar and where I can have a button in my externalpage that closes the browser and returns to the app from where I opened the browser. So how to close when you don ́t have a DONE button? I have seen that if I have var ref = window.open(encodeURI(url), '_self', 'location=yes'); then it is possible to close the browser with ref.close(); but if I use that in the externalpage that I opened it doesn't work, it is not closing the browser?

  2. Is there any way to autorotate any of them if I have set the orientation to portrait in the config file? I know that you can autorotate the child browser if you do it manually, not through the build service. Or do I have to set the orientation to both?

  3. I have tested all different ways to open the ChildBrowser and the InAppBrowser and I cant really see any big difference between them? Can the InAppBrowser use native feature wile the ChildBrowser can't or?

Answer

Claes Gustavsson picture Claes Gustavsson · Mar 29, 2013

OK, problem 1 to close is solved. This is what I use to open an external page in the InAppBrowser. From the page that I load in the InAppBrowser, I can close the InAppBrowser itself, returning to my app from where I opened the browser.

Create a page on your server - closeInAppBrowser.html that is just an empty html page, it doesn´t do anything

I open the browser with this:

<a href="#" onclick="openInAppBrowserBlank('http://www.mypage.asp?userId=1');">open InAppBrowser</a>

var ref = null;
function openInAppBrowserBlank(url)
{
    try {
ref = window.open(encodeURI(url),'_blank','location=no'); //encode is needed if you want to send a variable with your link if not you can use ref = window.open(url,'_blank','location=no');
         ref.addEventListener('loadstop', LoadStop);
         ref.addEventListener('exit', Close);
    }
    catch (err)    
    {
        alert(err);
    }
}
function LoadStop(event) {
         if(event.url == "http://www.mypage.com/closeInAppBrowser.html"){
            // alert("fun load stop runs");
             ref.close();
         }    
    }
function Close(event) {
         ref.removeEventListener('loadstop', LoadStop);
         ref.removeEventListener('exit', Close);
    } 

And to close the InAppBrowser from the page that I opened in the browser(http://www.mypage.asp) I have a button-link like this.

<a href="http://www.mypage.com/closeInAppBrowser.html"></a>

I hope it helps somebody else!