Remote validation in Asp.net Core Razor Pages

In this tutorial you will learn how to implement Remote validation in Asp.net Core step by step.

What is Remote validation in Asp.net Core?
Remote validation is a technique of validating data with database or any other external web services while user entering data in text box, making an ajax call to server side code to check if the input is valid or else display the error message immediately

Story behind implementation
We have created a simple form for accepting student registration for sports event, so apart from student name and mobile number we are also accepting a unique code as their choice, but we need to validate the code with backend server to ensure that the same code has not been taken by some other student. , and we have to check that at the time of registration only.

Asp.net core Remote validation example

Step 1:
Create a form with following fields like FirstName, LastName, Email and StudentCode, StudentCode is the field where we experiment Remote validation.

<form asp-controller="student" asp-action="index" method="post"> <div asp-validation-summary="ModelOnly" class="text-danger"> </div>
<div class="form-group">
<label asp-for="FirstName" class="control-label"> </label>
<input asp-for="FirstName" class="form-control" />
<span asp-validation-for="FirstName" class="text-danger"> </span>
</div>
<div class="form-group">
<label asp-for="LastName" class="control-label"> </label>
<input asp-for="LastName" class="form-control" />
<span asp-validation-for="LastName" class="text-danger"> </span>
</div>
<div class="form-group">
<label asp-for="Email" class="control-label"> </label>
<input asp-for="Email" class="form-control" />
<span asp-validation-for="Email" class="text-danger"> </span>
</div>
<div class="form-group">
<label asp-for="StudentCode" class="control-label"> </label>
<input asp-for="StudentCode" class="form-control" />
<span asp-validation-for="StudentCode" class="text-danger"></span>
	</div>
	<div class="form-group">
		<input type="submit" value="Save Student" class="btn btn-default" />
	</div>
</form>

Step 2:
Make sure you have added following jquery file reference, so that ajax request works properly

@section scripts
    {
    <script src="~/lib/jquery.js"></script>
    <script src="~/lib/jquery.validate.js"> </script>
    <script src="~/lib/jquery.validate.unobtrusive.js"> </script>
}

Step 3:
Now we create the model with all above fields, and notice how we are setting Remote attribute on StudentCode property

public class StudentModel
{
public int StudentId { get; set; }
[Required(ErrorMessage = "Firstname Required")]
[StringLength(50, ErrorMessage = "5 to 50 characters.", MinimumLength = 3)]
public string FirstName { get; set; }
[Required(ErrorMessage = "Lastname Required")]
[StringLength(50, ErrorMessage = "5 to 50 characters.", MinimumLength = 3)]
public string LastName { get; set; }
[Required(ErrorMessage = "Email Required")]
[EmailAddress(ErrorMessage = "Invalid email")]
public string Email { get; set; }
[Required(ErrorMessage = "Code Required")]
[Remote("ValidateCode","student", ErrorMessage = "Please enter a valid code")]
public string StudentCode { get; set; }
    }

This is how you call the method with Remote attribute
[Remote("MethodName","ControllerName", ErrorMessage = "Error Message")]

Step 4:
Now we write the method in server side code to interact with database or any external web service, this is the place where we check if the code is already exist in database

public IActionResult ValidateCode(string code)
        {
            string result;
            // here you can check the code with database 
            if (code == "wtr1")
            {
                result = "Valid code";
            }
            else
            {
                result = "Invalid code";
            }
            return Json(result);
        }

Note:
Here we have not connected with database or web service, we simply checked with a hardcoded value “wtr1”, you can replace that code with your database call or web service call

Asp.net Core Tutorial | Asp.net Core Interview Questions

Asp.net Core Course

asp.net core mvc remote validation

Asp.net Core Tutorial for Beginners

Learn .Net C# Programming

Learn .Net LINQ using C#

SQL Database Tutorials

MySQL Tutorials

Entity Framework Tutorials

Ado.Net Tutorials

LINQ Tutorials

Hire .Net Developer

Asp.Net Core C# Examples | Join Asp.Net MVC Course