Razorpay Payment Modal does not open

I am trying to integrate razorpay payment gateway in my website. I am currently in the testing phase. However, am facing a strange situation, whenever I am trying to call the checkout function, the Razorpay payment modal does not open. I get a rotating wheel for a few seconds and the page refreshes by itself. What is it that I am missing? Providing the payment function over here:

 function payAmount(purpose){
             
                sessionStorage.setItem('Transaction_Status','Started')
                
                var transaction_value = sessionStorage.getItem('amount')*100
                var address = userFlat+", Uniworld City, Newtown, Kolkata"

               var options = {
                    "key": "*************",
                   "amount": transaction_value, 
                 
                    "currency": "INR",
                    "name": "Something",
                    "description": purpose.toString(),
                   // "image": "",
                   // "order_id": "order_9A33XWu170gUtm", //This is a sample Order ID. Pass the `id` obtained in the response of Step 1
                 
                   "handler": function (response){
                        savetoDB(response)
                    },
                    "prefill": {
                        "name": username,
                        "email":"****@gmail.com",
                        "contact": userMobile
                    },
                    "notes": {
                        "address": address
                    },
                    "theme": {
                        "color": "#3399cc"
                    }
                    
                };
                alert("Before Razorpay")
                var rzp1 = new Razorpay(options);  
                alert("After Razorpay")
                rzp1.open();
            }