form.phtml

<input type="hidden" id="razorpay_payment_id" name="razorpay_plugincustomfields[razorpay_payment_id]" value="">
<input type="hidden" id="razorpay_signature" name="razorpay_plugincustomfields[razorpay_signature]" value="">

<script data-cfasync="false" src="https://checkout.razorpay.com/v1/checkout.js"></script>
<?php if ($this->from == 'signup') { ?>
    <a style="margin-left:0px;cursor:pointer;" class="app-btns primary customButton razorpayButton center-on-mobile" id="customButton"></a>
<?php } elseif ($this->from == 'invoice') { ?>
    <button class="app-btns primary customButton razorpayButton"><?php echo $this->user->lang('Pay Invoice'); ?></button>
<?php } ?>

<script data-cfasync="false" type="text/javascript">
    var razorpay_rzp;

    $('.razorpayButton').on('click', function(e) {
        <?php if ($this->from == 'signup') { ?>
            if ($('.razorpayButton').hasClass('disabled')) {
                return;
            }

            var password_validated = true;

            <?php if (!$this->loggedIn) { ?>
                $('.parsley-error-list.help-block').parent().removeClass('has-error');
                $('.parsley-error-list.help-block').remove();
                e.preventDefault();

                //let's validate remote data
                if ($('#password').length > 0) {
                    if ($.trim($('#password').val()) == "") return;
                    $.ajax({
                        type: "POST",
                        data: {"password": $('#password').val()},
                        url: 'index.php?controller=signup&fuse=admin&action=testpasswordstrength',
                        async: false,
                        success : function(response) {
                            json = clientexec.parseResponse(response);
                            if (!json.valid) {
                                password_validated = false;
                                $('#password').parent().addClass('has-error');
                                $('#password').after('<span class="help-block parsley-error-list">'+json.errorMessage+'</span>');
                                $('#password').get(0).scrollIntoView();
                            }
                        }
                    });
                }
            <?php } ?>

            if (password_validated && $('#submitForm').parsley('validate')) {
        <?php } ?>

        <?php
            $logoImage = '';
            if (isset($this->logoImage) && $this->logoImage != '') {
                $logoImage = str_replace("'", "\\'", $this->logoImage);
            }

            $companyName = '';
            if (isset($this->companyName) && $this->companyName != '') {
                $companyName = str_replace("'", "\\'", $this->companyName);
            }

            $firstName = '';
            $lastName = '';
            $email = '';
            $phone = '';
            $address = '';
            $city = '';
            $state = '';
            $zipCode = '';
            $country = '';
            if (isset($this->user)) {
                $firstName = str_replace("'", "\\'", $this->user->getFirstName());
                $lastName = str_replace("'", "\\'", $this->user->getLastName());
                $email = str_replace("'", "\\'", $this->user->getEmail());
                $phone = str_replace("'", "\\'", $this->user->getPhone());
                $address = str_replace("'", "\\'", $this->user->getAddress());
                $city = str_replace("'", "\\'", $this->user->getCity());
                $state = str_replace("'", "\\'", $this->user->getState());
                $zipCode = str_replace("'", "\\'", $this->user->getZipCode());
                $country = str_replace("'", "\\'", $this->user->getCountry(true));
            }
        ?>

        <?php if ($this->from == 'signup') { ?>
            var firstName = '';
            var lastName = '';
            var email = '';
            var phone = '';
            var address = '';
            var city = '';
            var state = '';
            var zipCode = '';
            var country = '';

            <?php if (!$this->loggedIn) { ?>
                var CT_1 = document.getElementById('CT_1');

                if(typeof CT_1 !== null && CT_1 !== 'undefined' ) {
                    firstName = CT_1.value;
                }

                var CT_2 = document.getElementById('CT_2');

                if(typeof CT_2 !== null && CT_2 !== 'undefined' ) {
                    lastName = CT_2.value;
                }

                var CT_4 = document.getElementById('CT_4');

                if(typeof CT_4 !== null && CT_4 !== 'undefined' ) {
                    email = CT_4.value;
                }

                var CT_8 = document.getElementById('CT_8');

                if(typeof CT_8 !== null && CT_8 !== 'undefined' ) {
                    phone = CT_8.value;
                }

                var CT_3 = document.getElementById('CT_3');

                if(typeof CT_3 !== null && CT_3 !== 'undefined' ) {
                    address = CT_3.value;
                }

                var CT_5 = document.getElementById('CT_5');

                if(typeof CT_5 !== null && CT_5 !== 'undefined' ) {
                    city = CT_5.value;
                }

                var CT_6 = document.getElementById('CT_6');

                if(typeof CT_6 !== null && CT_6 !== 'undefined' ) {
                    state = CT_6.value;
                }

                var CT_7 = document.getElementById('CT_7');

                if(typeof CT_7 !== null && CT_7 !== 'undefined' ) {
                    zipCode = CT_7.value;
                }

                var CT_15 = document.getElementById('CT_15');

                if(typeof CT_15 !== null && CT_15 !== 'undefined' ) {
                    country = CT_15.value;
                }
            <?php } ?>
        <?php } ?>

        var razorpay_options = {
            "key":         '<?php echo $this->keyId; ?>',
            "currency":    '<?php echo $this->currency; ?>',
            "image":       '<?php echo $logoImage; ?>',
            "name":        '<?php echo $companyName; ?>',
        <?php if ($this->from == 'invoice') { ?>
            "description": '<?php echo $this->user->lang("Invoice")." #".$this->invoiceId; ?>',
            "amount":      '<?php echo $this->amount; ?>', // paise
            "order_id":    '<?php echo $this->razorpayOrderId; ?>',
        <?php } elseif ($this->from == 'signup') { ?>
            "description": '<?php echo $this->user->lang("New Order");?>',
            "amount":      Math.round(document.getElementById("totalPay_raw").value * 100),  // paise
        <?php } ?>

            "prefill": {
            <?php if ($this->from == 'signup') { ?>
                "name":    firstName+' '+lastName+'<?php echo $firstName." ".$lastName; ?>',
                "email":   email+'<?php echo $email; ?>',
                "contact": phone+'<?php echo $phone; ?>'
            <?php } else { ?>
                "name":    '<?php echo $firstName." ".$lastName; ?>',
                "email":   '<?php echo $email; ?>',
                "contact": '<?php echo $phone; ?>'
            <?php } ?>
            },

            "notes": {
                "invoice_id": '<?php echo $this->invoiceId; ?>',
            <?php if ($this->from == 'signup') { ?>
                "address":    address+'<?php echo $address; ?>',
                "city":       city+'<?php echo $city; ?>',
                "state":      state+'<?php echo $state; ?>',
                "zip":        zipCode+'<?php echo $zipCode; ?>',
                "country":    country+'<?php echo $country; ?>'
            <?php } else { ?>
                "address":    '<?php echo $address; ?>',
                "city":       '<?php echo $city; ?>',
                "state":      '<?php echo $state; ?>',
                "zip":        '<?php echo $zipCode; ?>',
                "country":    '<?php echo $country; ?>'
            <?php } ?>
            },

            "theme": {
                "color": "#F37254"
            }
        };

        /**
         * The entire list of Checkout fields is available at
         * https://docs.razorpay.com/docs/checkout-form#checkout-fields
         */
        razorpay_options.handler = function (response){
            document.getElementById('razorpay_payment_id').value = response.razorpay_payment_id;
            document.getElementById('razorpay_signature').value = response.razorpay_signature;

            <?php if ($this->from == 'invoice' || $this->from == 'signup') { ?>
                $('#submitButton').click();
            <?php } ?>
        };

        // Boolean whether to show image inside a white frame. (default: true)
        razorpay_options.theme.image_padding = false;

        razorpay_options.modal = {
            ondismiss: function() {
                console.log("This code runs when the popup is closed");
            },
            // Boolean indicating whether pressing escape key
            // should close the checkout form. (default: true)
            escape: true,
            // Boolean indicating whether clicking translucent blank
            // space outside checkout form should close the form. (default: false)
            backdropclose: false
        };

        razorpay_rzp = new Razorpay(razorpay_options);

        // Open Handler
        razorpayOpenHandler();

        <?php if ($this->from == 'signup') { ?>
            }
        <?php } ?>

        e.preventDefault();
    });

    function razorpayOpenHandler() {
        razorpay_rzp.open();
    }

    // Close Checkout on page navigation
    $(window).on('popstate', function() {
        razorpay_rzp.close();
    });
</script>