Solution 1 :

How you run the above pages?
Let’s use the localhost server, use localStorage.setItem to save, and use localStorage.getItem to get it in the same domain.

Problem :

I am trying to implement a payment integration on my web; now after going with the sample code i was able to develop the first phase which is the payment collection and processing.

Now my issue here is how do i display the payment detail on another page when it is successful as it redirects there

<div class="row">
    <div class="col-75">
    <div class="container">
    <form method="POST" id="payment-form">
    <div class="row">
    <div class="col-50-left">
    <h3>Billing Information</h3>
    <label for="fname"><i class="fa fa-user"></i> First Name</label>
    <input type="text" id="firstname" name="firstname" placeholder="First Name" required="">
    <label for="fname"><i class="fa fa-user"></i> Last Name</label>
    <input type="text" id="lastname" name="lastname" placeholder="Last Name">

    <label for="adr"><i class="fa fa-money"></i> Amount</label>
    <input type="number" id="amount" name="amount" placeholder="NGN 20000">

    <label for="city"><i class="fa fa-institution"></i> City</label>
    <input type="text" id="city" name="city" placeholder="Benin City">

    <div class="col-50">
    <div class="icon-container">
    <img src="assets/images/remita-payment-options.png" style="width: 100%;">
    <label for="email"><i class="fa fa-envelope"></i> Email</label>
    <input type="email" id="email" name="email" placeholder="[email protected]">

            <label for="adr"><i class="fa fa-phone"></i> Phone</label>
            <input type="text" id="phone" name="phone" placeholder="+234 XXX XXX XXXX">

            <label for="city"><i class="fa fa-comment"></i> Narration</label>
            <input type="text" id="narration" name="narration" placeholder="Donation">
        <button type="button" class="btn" onclick="makePayment();"> Pay </button>


                    var date = new Date();
                    var timestamp = date.getTime();
                    var form = document.querySelector("#payment-form");

                    function makePayment() {
                      var paymentEngine = RmPaymentEngine.init({
                         key: 'RzAwMDAyMjg5NTl8NDMwNjUxNDd8ZmM4MDg5Yjc3M2Y5ZTk0YWViMDJkMmRmMDVhYmI2MjAwMWVhYjNjY2I5NmU0ZWU3MzBiNTMwYzNlOGEzYTYyMTc2ODM1NzBkYmI4MmI3MTE1ZmUxMzkxYTg0MzZhYjM0ODlkY2U0NzZiMTE4OWU0YTNjMjA1MGJjY2UyNzNkN2I=',
                          customerId: form.querySelector("#email").value,
                          firstName: form.querySelector("#firstname").value,
                          lastName: form.querySelector("#lastname").value,
                          email: form.querySelector("#email").value,
                          amount: form.querySelector("#amount").value,
                          transactionId: timestamp,
                          narration: form.querySelector("#narration").value,
                          phone: form.querySelector("#phone").value,
                          city: form.querySelector("#city").value,
                          onSuccess: function (response) {
                          console.log('callback Successful Response', response);
                          console.log('Amount', response.amount);
                          console.log('TransactionId: ', response.transactionId);
                          console.log('RRR: ', response.paymentReference);

                          /*How do i display these data on the save_live.html page
                           when it redirects there*/
                        window.localStorage.setItem("globaly", JSON.stringify(response));
                        window.location.href = 'save_live.html';

                          onError: function (response) {
                          console.log('callback Error Response', response);
                          onClose: function () {


                    <script type="text/javascript" src=""></script>

This is the save_live.html page script below and what i have tried doing

    <div class="row">
    <div class="col-75">
    <div class="container" id="paid">


    $.getJSON("index.html", function(data){
      var payment_data = '';
      $.each(data, function(key, value){

        payment_data += '<div>';
        payment_data += '<p>'+value.paymentReference+'</p>';
        payment_data += '<p>'+value.amount+'</p>';
        payment_data += '<p>'+value.transactionId+'</p>';
        payment_data += '</div>';


Comment posted by Cyber Ofure

@Nghia Nguyen i have tried that and i get this [Object object] displayed as response