bbone/application/modules/Auth/views/otp_verification.php
suseendhiran17 c489cb2138 suseendhiran
2023-01-11 12:07:23 +05:30

174 lines
6.0 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- Meta, title, CSS, favicons, etc. -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AMS </title>
<!-- Bootstrap -->
<link href="<?php echo base_url(); ?>/assets/default/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="<?php echo base_url(); ?>/assets/default/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<!-- NProgress -->
<link href="<?php echo base_url(); ?>/assets/default/nprogress/nprogress.css" rel="stylesheet">
<!-- Animate.css -->
<link href="<?php echo base_url(); ?>/assets/default/animate.css/animate.min.css" rel="stylesheet">
<!-- Custom Theme Style -->
<link href="<?php echo base_url(); ?>/assets/default/build/css/custom.min.css" rel="stylesheet">
</head>
<style>
.otp{
text-align: right;
clear: both;
float:right;
}
</style>
<body class="login">
<div class="login_wrapper">
<div class="animate form login_form">
<section class="login_content">
<form id="otp-form" data-parsley-validate class="form-horizontal form-label-left" method="post" action="" enctype="multipart/form-data">
<input type="hidden" name="<?php echo $this->security->get_csrf_token_name();?>" value="<?php echo $this->security->get_csrf_hash();?>">
<input type="hidden" id="hidden_otp" name="hidden_otp" class="form-control" value="" />
<input type="hidden" id="id" name="id" value="">
<h1>Forgot Password</h1>
<!-- <div>
<input type="text" class="form-control" placeholder="Username" required="" />
</div> -->
<div>
<a href="#" onclick="send_otp()" class="otp"> Send OTP </a>
<div>
<input type="email" id="email" name="user_name" class="form-control" placeholder="Email" required="required" />
<p id="span_msg"></p>
</div>
</div>
<div>
<input type="text" id="otp" name="otp" class="form-control" placeholder="OTP" required="required" />
<p id="otp_span_msg"></p>
</div>
<div>
<button type="button" class="btn btn-primary">Submit</button>
<!-- Button trigger modal -->
<!-- <button type="button" class="btn btn-secondary" data-toggle="modal" data-target=".bs-example-modal-sm">
Small modal
</button> -->
</div>
<div class="clearfix"></div>
<div class="separator">
<!-- <p class="change_link">Already a member ?
<a href="<?php echo base_url().'auth/verify_user'?>" class="to_register"> Log in </a>
</p> -->
<div class="clearfix"></div>
<br />
<div>
<!-- <h1><i class="fa fa-paw"></i> Gentelella Alela!</h1>
<p>©2016 All Rights Reserved. Gentelella Alela! is a Bootstrap 4 template. Privacy and Terms</p> -->
</div>
</div>
</form>
</section>
</div>
</div>
<div class="body"></div>
<script>
function send_otp(){
if ($('#email').val())
{
$('#span_msg').html('');
var data = $("#otp-form").serialize();
$.ajax({
type: "post",
url: "<?php echo base_url();?>auth/send__mail",
data: data,
json: true,
success: function (response) {
// decode encoded json
response = jQuery.parseJSON(response)
if (response.status == "failed") {
//update the csrf to the form
$('input[name=csrf_test_name]').val(response.csrf_hash);
$('#span_msg').html('invalid username').css('color', 'red');
}
else{
//update the csrf to the form
$('input[name=csrf_test_name]').val(response.csrf_hash);
$('#hidden_otp').val(response.otp);
$('#id').val(response.id);
console.log(response.otp);
console.log(response.id);
}
},
error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
});
}
else
{
$('#span_msg').html('Enter Email').css('color', 'red');
}
}
$('#email').on('keyup', function () {
if (!$('#email').val())
$('#span_msg').html('');
});
$('#otp').on('keyup', function () {
if (!$('#otp').val())
$('#otp_span_msg').html('');
});
$(document).on('click','#close-form',function(){
$('.bs-example-modal-sm').css('display', 'none');
});
$(document).on('click','.btn-primary',function(){
if ($('#otp').val()){
var data = $("#otp-form").serialize();
console.log(data);
$.ajax({
type: "post",
url: "<?php echo base_url();?>auth/verify_otp",
data: data,
json: true,
success: function(response) {
// decode encoded json
response = jQuery.parseJSON(response)
if (response.status === "failed") {
//update the csrf to the form
$('input[name=csrf_test_name]').val(response.csrf_hash);
$('#otp_span_msg').html('invalid otp').css('color', 'red');
}
else {
//update the csrf to the form
$('input[name=csrf_test_name]').val(response.csrf_hash);
console.log(response.id);
$('.form').html(response.htmlPage);
// location.href = `<?php echo base_url();?>auth/change_password_view/${response.id}`;
}
},
error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
});
}
else{
$('#otp_span_msg').html('Pls enter OTP').css('color', 'red');
}
});
</script>
</body>
</html>