Hi 

I am testing my website which is  http://138.68.164.186:5000/

The link is only working when the laptop is switched on. (still in development stage)

As a logged in user there is a subscription (billing page). The billing page contains the Paypal checkout button. When I click on the button a new browser opens up bu closes very quickly. I have been able to grab a screen shot. 

I have used postman to generate the API

Below is my script. 

I have added the Paypal script, PayPal button. 

{% extends 'layout/dashboard.html' %}
{% load static %}
{% load crispy_forms_tags %}

{% block body %}

<div class="container-xxl flex-grow-1 container-p-y">
<h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light">Account Settings /</span> Billing </h4>

<div class="row">
<div class="col-md-12">
<ul class="nav nav-pills flex-column flex-md-row mb-3">
<li class="nav-item">
<a class="nav-link active" href="#;"><i class="bx bx-user me-1"></i> Billing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="pages-account-settings-notifications.html"
><i class="bx bx-bell me-1"></i> Notifications</a>
</li>
</ul>

<div class="card">
<h5 class="card-header">Billing Information</h5>
<div class="card-body">
<div class="mb-3 col-12 mb-0">
<!-- -->
<script src="https://www.paypal.com/sdk/js?client-id=AQK_07Ti2_xSUVBYerKpxubDibK9XaF3efm2AwvUEch3NA5pp2ru3wFixkek...">
</script>

{% if user.profile.subscriptionType == "free" %}
<div class="alert alert-warning">
<h6 class="alert-heading fw-bold mb-1">You are currently on the Free Tier</h6>
<p class="mb-0">You can cancel your subscription at any time, no strings attached</p>
</div>
<div id="paypal-button-container-1"></div>
{% elif user.profile.subscriptionType == "starter" %}
<div class="alert alert-info">
<h6 class="alert-heading fw-bold mb-1">You are currently on the Starter Tier</h6>
<p class="mb-0">You can cancel your subscription at any time, no strings attached</p>
</div>
<div id="paypal-button-container-2"></div>
{% elif user.profile.subscriptionType == "advanced" %}
<div class="alert alert-success">
<h6 class="alert-heading fw-bold mb-1">You are currently on the Advanced Tier</h6>
<p class="mb-0">You can cancel your subscription at any time, no strings attached</p>
</div>
{% else %}
<h1>Something went wrong</h1>
{% endif %}
</div>

</div>
</div>
</div>
</div>
</div>

{% endblock %}

{% block js %}
<script>
paypal.Buttons({
createSubscription: function(data, actions) {
return actions.subscription.create({
'plan_id': 'P-1F15340389910541HMNONK2A' // Creates starter plan subscription
});
},
onApprove: function(data, actions) {
alert('You have successfully created subscription ' + data.subscriptionID); // Optional message given to subscriber
},
onCancel: function (data) {
alert('You have cancelled your subscription'); //When the transaction cancels.
}
}).render('#paypal-button-container-1'); // Renders the PayPal button
</script>
{% endblock %}