What are the different validators in ASP.NET?

Welcome, to yet another coding interview question. Today, we will be exploring the different validators in ASP.NET. Put your booty in a good position and let’s get into it !

Vali… what?

In ASP.NET, validators are a set of powerful tools that help ensure the validity of user input in web forms. They allow developers to define rules and constraints for user input, and provide real-time validation feedback to users, helping to maintain data integrity and improve the overall user experience.

Validators play a crucial role in validating user input on both the client side and the server side. Client-side validation occurs in the user’s browser, providing instant feedback to the user without the need for a round trip to the server. This helps in terms of responsiveness and reducing server load.

You : Ahaa… So if there is a client — side validation. There must be a server — side validation too. I am smart!
Me : But … I was just about too…
You : No, no. Figured it out on my own. Looking hella good now …
Me : Okay, okay. You are right! Shall we move forward now ??
You : YES! PLEASE TELL ME MORE (Power of writing, I can make you say anything)

On the other hand, server-side validation is performed on the web server and serves as a fallback mechanism to ensure data integrity, as client-side validation can be bypassed. Let’s take a closer look to the two possible types.

Client-Side Validation

When validation is done on the client browser, then it is known as Client-Side Validation. We use JavaScript to do the Client-Side Validation. Here is an example of client-side validation.

<!DOCTYPE html>
<html>
<head>
    <title>Client-side Validator Example</title>
    <script>
        function validateInput() {
            var input = document.getElementById("txtEmail").value;
            var pattern = /^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,}$/;
            
            if (input.match(pattern)) {
                return true; // Input is valid
            } else {
                alert("Please enter a valid email address!");
                return false; // Input is invalid
            }
        }
    </script>
</head>
<body>
    <form>
        <label for="txtEmail">Email:</label>
        <input type="text" id="txtEmail" name="txtEmail" />

        <input type="submit" value="Submit" onclick="return validateInput()" />
    </form>
</body>
</html>

In this example, we have a simple HTML form with an email input field (txtEmail) and a submit button. The validateInput() JavaScript function is called when the submit button is clicked.

Get Ivo Manolov’s stories in your inbox

Join Medium for free to get updates from this writer.

Remember me for faster sign in

Within the validateInput() function, we retrieve the value of the email input field and define a regular expression pattern to match against. In this case, the pattern checks for a valid email address format.

If the input value matches the pattern, the function returns true, indicating that the input is valid. If the input value does not match the pattern, an alert is displayed to the user with a validation error message, and the function returns false, indicating that the input is invalid.

This client-side validation occurs in the user’s browser before the form is submitted to the server, providing instant feedback to the user without a round trip to the server.

You : Ahaa… You are pretty good, I might follow you for the future
Me : But … You haven’t followed me yet ?
You : No, no. Trying to figure out if it is worth it.
Me : Okay, okay. You are right! Shall we move forward now ??
You : YES! And If I like it, I will follow you!!!

Server-Side Validation

When validation occurs on the server, then it is known as Server-Side Validation. Server-Side Validation is a secure form of validation. The main advantage of Server-Side Validation is if the user somehow bypasses the Client-Side Validation, we can still catch the problem on the server side.

Let’s go straight to the example.

Server

using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Web.Http;

namespace YourApi.Controllers
{
    public class FormController : ApiController
    {
        [HttpPost]
        public IHttpActionResult SubmitForm(FormModel model)
        {
            var validationResults = new List<ValidationResult>();
            var validationContext = new ValidationContext(model, serviceProvider: null, items: null);
            bool isValid = Validator.TryValidateObject(model, validationContext, validationResults, true);

            if (!isValid)
            {
                var errors = new List<string>();
                foreach (var validationResult in validationResults)
                {
                    errors.Add(validationResult.ErrorMessage);
                }
                return BadRequest(errors);
            }

            // Process the submitted data
            // ...

            return Ok();
        }
    }

    public class FormModel
    {
        [Required(ErrorMessage = "Please enter a name.")]
        public string Name { get; set; }

        [Required(ErrorMessage = "Please enter an email.")]
        [EmailAddress(ErrorMessage = "Please enter a valid email address.")]
        public string Email { get; set; }
    }
}

Here, you can see the attributes ‘[Required] ’ for example. These are going to produce an error in the server side, if by any chance we make a query to the server without passing them through our client. And here you have it. Easy Peasy, right ?

I hope you found it useful and I will see you in the next article!