Monday, November 18, 2019

Email/User Name already Taken Remote Validation in asp.net core |Client Side Validations | Built in Validations From Data Annotations |Custom Validation

Hello & As-salam u alikum ! , In the previous articles we had discussed about Asp.net Core Identity Authorization and Allow Anonymous attribute, There is the reference in the below link.

https://dotnetcorecommunity.blogspot.com/2019/11/authorization-in-aspnet-core-identity.html


At the moment, we are going to discuss the Following concepts in this article

  1. J-query Client Side Validation
  2. Remote Validation
  3. Custom Validation

Step# 1:  
Perform the All steps that I have explained in the previous article, Click Here to see the previous article.

Step# 2:  
Right Click on the Project--> Add---> Client side Library 


In the Library search box, type "jquery-validate" , you will get intellisense & add the following Libraries as shown below.




Step# 3:  
Go to the view folder ---> Shared ---> Layout.cshtml & add these three scripts file under the body closing tag. 

<script src="~/lib/jquery/jquery.js"></script>
<script src="~/lib/jquery-validate/jquery.validate.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>


Step# 4:  


Now, Add some Data Annotations to the view model class, Following are the Annotations that are commonly used, you may explore more annotation from Here.

  1. [Required]
  2. [Range(1, 100)]
  3. [StringLength(60, MinimumLength = 3)]
  4. [RegularExpression(@"^[A-Z]+[a-zA-Z0-9""'\s-]*$")]


Step# 4:  



Now,  Run the project , Come to the Register page or that page on which model you have applied validations using Data Annotations.Now when you click on Submit or Post Button without entering the correct data in the data field , the page will not take your response to the server & shows you some error messages as shown below. This is one of  the advantage of Client side validations, In which user cannot interact with server until he/she fills the data field correctly, this approach will leads to the less load on server.



If you enter any domain Email, like @yahoo.com ,@gmail.com @outlook.com ,But In our case we want to Register our Custom domain Email i.e "@ideas.com" . For this purpose we need to do the custom validation.

Step# 5:  
Add a new class for custom validation named as "ValidEmailDomainAttribute" and inherit the class "ValidationAttribute" and paste the following code in that class.


using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;

namespace AspCoreIdentity.Models
{
    public class ValidEmailDomainAttribute: ValidationAttribute
    {
        private readonly string allowedDomain;

        public ValidEmailDomainAttribute(string allowedDomain)
        {
            this.allowedDomain = allowedDomain;
        }

        public override bool IsValid(object value)
        {
            string[] strings = value.ToString().Split('@');
            return strings[1].ToUpper() == allowedDomain.ToUpper();
        }
    }
}


Step# 6:  
Come to the View Model Class and add the Custom attribute that you have made in the above code.

Now you can only Register the Email domain of @ideas.com.



Now I Register an Account with Email Id "conceptacademy@ideas.com". I get registered Successfully. If again I register with the same email, our Application will get crashed & shows an error page.For this Scenario we will apply remote validation.

 Step# 7:  
Add the below action method in the Account Controller that will check whether the entered email is already added to database or not.


   [AcceptVerbs("Get", "Post")]
        [AllowAnonymous]
        public async Task<IActionResult> IsEmailInUse(string email)
        {
            var user = await userManager.FindByEmailAsync(email);

            if (user == null)
            {
                return Json(true);
            }
            else
            {
                return Json($"Email {email} is already in use.");
            }

        }



Step# 8:  

Add the Remote attribute in view model class as shown below to validate the Email field.




Conclusion :
that's all for this blog, we have successfully Implement the Asp.net core Identity with Remote,Custom & Client end Validation ,In the next coming articles we will discuss more details on this topic.Thank you for watching,Have a great day !

Subscribe to my Youtube  


0 Comments:

Post a Comment

Do not Add Spam links in the Comment Box

Subscribe to Post Comments [Atom]

<< Home