@page "/register"
@model FaceAdminApp.Pages.Auth.RegisterModel
@{
ViewData["Title"] = "Register";
}
@if (Model.IsPhoneNumberPresent)
{
<div class="container">
<div class="row justify-content-center">
<div class="col-md-5">
<h5>NEW REGISTER</h5>
<div class="card">
<div class="card-body">
<form method="post" asp-page-handler="GenerateOtp">
<div class="px-3 my-1 d-flex justify-center">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="CountryCode">Country Code</label>
<select class="form-control" id="CountryCode" asp-for="LoginModel.CountryCode">
<option value="+91">+91</option>
<option value="+49">+49</option>
<option value="+1">+1</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="PhoneNumber">Phone Number</label>
<input type="text" class="form-control" id="PhoneNumber" asp-for="LoginModel.Username">
</div>
</div>
</div>
</div>
<div class="px-3 my-1 d-flex justify-center">
<div>
<label for="OTP">OTP</label>
<input id="OTP" type="text" class="form-control" asp-for="LoginModel.Password" autocomplete="off" />
</div>
<button type="submit" class="btn btn-outline-primary btn-sm ml-4 mt-4" style="width: 150px;" disabled="@Model.OtpProcessing">
@if (Model.OtpProcessing)
{
<div class="spinner-border spinner-border-sm" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<span>GENERATING</span>
}
else
{
<span>GENERATE OTP</span>
}
</button>
</div>
</form>
<div class="mt-6 d-flex justify-space-between align-center">
<a asp-page="/Auth/Login" class="btn btn-success">Login</a>
<form method="post" asp-page-handler="ValidPhoneNumberSubmit">
<button type="submit" class="btn btn-primary ml-4" disabled="@Model.Processing">
@if (Model.Processing)
{
<div class="spinner-border spinner-border-sm" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<span>VALIDATING</span>
}
else
{
<span>VALIDATE</span>
}
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
}
else
{
<div class="container">
<div class="row justify-content-center">
<div class="col-md-5">
<h5>NEW REGISTER</h5>
<div class="card">
<div class="card-body">
<form method="post">
<div class="px-3 my-1 d-flex justify-center">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="CountryCode">Country Code</label>
<select class="form-control" id="CountryCode" asp-for="LoginModel.CountryCode">
<option value="+91">+91</option>
<option value="+49">+49</option>
<option value="+1">+1</option>
<option value="+1">+33</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="PhoneNumber">Phone Number</label>
<input type="text" class="form-control" id="PhoneNumber" asp-for="LoginModel.Username">
</div>
</div>
</div>
</div>
<div class="px-3 my-1 d-flex justify-center">
<div>
<label for="OTP">OTP</label>
<input id="OTP" type="text" class="form-control" asp-for="LoginModel.Password" autocomplete="off" />
</div>
<button type="submit" class="btn btn-outline-primary btn-sm ml-4 mt-4" style="width: 150px;" disabled="@Model.OtpProcessing">
@if (Model.OtpProcessing)
{
<div class="spinner-border spinner-border-sm" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<span>GENERATING</span>
}
else
{
<span>GENERATE OTP</span>
}
</button>
</div>
</form>
<div class="mt-6 d-flex justify-space-between align-center">
<a asp-page="/Auth/Login" class="btn btn-success">Login</a>
<button type="submit" class="btn btn-primary ml-4" disabled="@Model.Processing">
@if (Model.Processing)
{
<div class="spinner-border spinner-border-sm" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<span>VALIDATING</span>
}
else
{
<span>VALIDATE</span>
}
</button>
</div>
</div>
</div>
</div>
</div>
</div>
}
using FaceAdminApp.Auth;
using FaceAdminApp.DTOs;
using FaceAdminApp.Models;
using FaceAdminApp.Services;
using FaceAdminApp.Utilities;
using FaceAdminApp.ViewModels;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace FaceAdminApp.Pages.Auth
{
public class RegisterModel : PageModel
{
private readonly ILoginService _loginService;
private readonly VacApiService _apiService;
public RegisterModel(ILoginService loginService, VacApiService apiService)
{
_loginService = loginService;
_apiService = apiService;
}
[BindProperty]
public string LoginPhoneNumber { get; set; }
[BindProperty]
public string CountryCode { get; set; }
[BindProperty]
public OtpRegisterVm LoginModel { get; set; }
public bool IsPhoneNumberPresent { get; set; }
public bool IsPhoneNumberValidated { get; set; }
public bool OtpProcessing { get; set; }
public bool Processing { get; set; }
//public void OnGet()
//{
// if (!string.IsNullOrEmpty(LoginPhoneNumber))
// {
// IsPhoneNumberPresent = true;
// LoginModel = new OtpRegisterVm { Username = LoginPhoneNumber, CountryCode = CountryCode };
// }
// else
// {
// IsPhoneNumberPresent = false;
// }
//}
public void OnGet(string LoginPhoneNumber)
{
IsPhoneNumberPresent = !string.IsNullOrEmpty(LoginPhoneNumber);
if (IsPhoneNumberPresent)
{
LoginModel = new OtpRegisterVm { Username = LoginPhoneNumber, CountryCode = CountryCode };
// Optionally, you can set LoginModel.Username here if needed
}
}
public async Task<IActionResult> OnPostGenerateOtpAsync()
{
OtpProcessing = true;
if (string.IsNullOrEmpty(LoginModel.Username))
{
Notify.Add(TempData, false, "", "Phone Number required");
OtpProcessing = false;
return Page();
}
else if (LoginModel.Username.Length < 10)
{
Notify.Add(TempData, false, "", "Enter valid Phone Number");
OtpProcessing = false;
return Page();
}
string generatedOtp =
OtpGenerator.GenerateOtp();
// Store the generated OTP in TempData or ViewBag to pass it to the view
TempData["GeneratedOTP"] = generatedOtp;
// Display success message
Notify.Add(TempData, true, $"OTP Generated successfully: {generatedOtp}", "");
OtpProcessing = false;
return Page();
//var dto = new PhoneNumberDto { PhoneNumber = LoginModel.CountryCode + LoginModel.Username };
//var response = await _apiService.GenerateRegisterOtp(dto);
//if (response.IsSuccess)
//{
// Notify.Add(TempData, true, "OTP Generated successfully", "");
//}
//else
//{
// Notify.Add(TempData, false, "", response.Message);
//}
//OtpProcessing = false;
//return RedirectToPage("/Auth/RegistrationForm");
}
public async Task<IActionResult> OnPostValidPhoneNumberSubmitAsync()
{
Processing = true;
if (string.IsNullOrEmpty(LoginModel.Username) || string.IsNullOrEmpty(LoginModel.Password))
{
Notify.Add(TempData, false, "", "Phone Number and OTP are required");
Processing = false;
return Page();
}
if (LoginModel.Username.Length < 10 || LoginModel.Password.Length != 6)
{
Notify.Add(TempData, false, "", "Invalid Phone Number or OTP");
Processing = false;
return Page();
}
var dto = new LoginDto { Username = LoginModel.CountryCode + LoginModel.Username, Password = LoginModel.Password };
var response = await _apiService.ValidateRegisterOtp(dto);
if (response.IsSuccess)
{
Notify.Add(TempData, true, "Phone number validated", "");
IsPhoneNumberValidated = true;
}
else
{
Notify.Add(TempData, false, "", response.Message);
}
Processing = false;
return RedirectToPage("/Auth/RegistrationForm");
}
}
}
i need to render forms conditionally , if number not empty if block should execute(when number is present )to generate otp and if anny number is empty want render register form without perming any function
am trying to excute this code for the otp generation and validationn but if block condition is not working even though number provided
public bool IsPhoneNumberPresent { get; set; } but when am setting this to initially false the otp generation is working but validation is asking for number and otp required . please help me out to reach this