So here is my code using ajax to load php and insert values into database.
<script type="text/javascript">
$(document).ready(function(){
$('#regBtn').click(function(){
event.preventDefault();
$.ajax({
url:"register.php",
type:"POST",
data: $('#myForm').serialize(),
beforeSend: function() {
$('#RepMsg').fadeIn();
$('#RepMsg').html('Sending OTP...');
},
success:function(response){
if(response == 1){
$('#RepMsg').fadeIn();
$('#RepMsg').html('<i class="fa-solid fa-triangle-exclamation"
style="color:red; font-size:11px;"></i>This Email is already
Taken.')
}else{
window.location.replace('verify.php');
}
}
})
});
});
</script>
So what I want now is to replace that redirect link of verify.php to a pop up menu where I can enter OTP instead of directing it to whole new page.
My Answer:
html
OTP Verification
In this code, when the form is submitted, it sends an AJAX request to a PHP file `verify_otp.php` with the email entered by the user. The PHP file generates an OTP and sends it to the user's email. Then, a pop-up window is displayed asking the user to enter the OTP. When the user clicks on the "Verify OTP" button, another AJAX request is sent to the PHP file with the entered OTP. The PHP file verifies the OTP and sends a response back to the JavaScript. If the OTP is correct, an alert is shown to the user.
Rate this post
4 of 5 based on 5088 votesComments