How to open Paypal in inApp Browser using cordova/phonegap

Question

I am integrating PayPal integration using JavaScript in PhoneGap, but I'm facing an issue that it is not opening in the inApp browser. Instead of that it is opening outside of my app. So I want the PayPal URL to be opened in the inApp browser.
I'm new to PhoneGap so if anyone knows please help with it. Below is the code

<form id="openpaypal" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="NSH74TD463ZSU">
<input type="image" src="https://www.paypalobjects.com/en_GB/i/btn/btn_buynowCC_LG.gif" border="0" name="submit" alt="PayPal – The safer,  easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
</form>

//script here

<script>
        document.getElementById("openpaypal").addEventListener("click", openBrowser);

        function openBrowser() {
            alert("called here");
            var url = 'https://www.paypal.com/cgi-bin/webscr';
            var target = '_blank';
            var options = "location=yes"
            var ref = cordova.InAppBrowser.open(url, target, options);

            ref.addEventListener('loadstart', loadstartCallback);
            ref.addEventListener('loadstop', loadstopCallback);
            ref.addEventListener('loadloaderror', loaderrorCallback);
            ref.addEventListener('exit', exitCallback);

            function loadstartCallback(event) {
                console.log('Loading started: ' + event.url)
            }

            function loadstopCallback(event) {
                console.log('Loading finished: ' + event.url)
            }

            function loaderrorCallback(error) {
                console.log('Loading error: ' + error.message)
            }

            function exitCallback() {
                console.log('Browser is closed...')
            }
        }
    </script>

Yes its because of your first line, just add your `cordova.js` without any folder path like ` — Kirankumar Dafda, Dec 14 '16 at 06:40
I have added already but still it's not open in inApp Browser — Shivanand L.C, Dec 14 '16 at 06:41
yes this is the inApp browser plugin I have added cordova plugin add cordova-plugin-inappbrowser ..but still its not resolved — Shivanand L.C, Dec 14 '16 at 06:46

Kirankumar Dafda · Accepted Answer · 2016-12-14T07:05:07.967

For cordova command

Add Plugin First

Here is link

$ cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git

This is your script

<script src="assets/js/cordova.js" type="text/javascript"></script> 
<script src="assets/js/min/app.js" type="text/javascript"></script>

But while building an app cordova.js automatically add to root path of www folder

So add it like below

<script src="cordova.js" type="text/javascript"></script>

For PhoneGap Build

add this line to config.xml file

<plugin name="org.li8.inappbrowser" spec="0.1" source="pgb" />

Set Script

<script src="phonegap.js" type="text/javascript"></script>

Edited

call your function after device ready may be it is making problem for you

document.addEventListener("deviceready",onDeviceReady,false);

function onDeviceReady()
{
    document.getElementById("openpaypal").addEventListener("click", openBrowser);
}

function openBrowser() 
{
    var url = 'https://www.paypal.com/cgi-bin/webscr';
    var target = '_blank';
    var options = "location=yes";
    var ref = window.open(url, target, options);
}

Anyhow Thank you. I have found alternative solution for it using javascript. — Shivanand L.C, Dec 15 '16 at 14:36
@ShivanandL.C Can you post the details how you figured it out. I am looking for similar code. — WebzinSamir, Nov 22 '17 at 13:15

How to open Paypal in inApp Browser using cordova/phonegap

1 Answers1

For cordova command

For PhoneGap Build

Edited