Adding Validation to ASP.NET Core MVC 7 App with SQLite
Mohamad's interest is in Programming (Mobile, Web, Database and Machine Learning). He is studying at the Center For Artificial Intelligence Technology (CAIT), Universiti Kebangsaan Malaysia (UKM).
Continue from https://hashnotes.hashnode.dev/asp-dot-net-scaffold-a-controller-and-views-for-crud-operations
In this tutorial, you’ll learn how to add validation to your ASP.NET Core MVC 7 app running in Replit , using SQLite and Entity Framework Core .
You’ll add:
Data annotations for model validation
Validation messages in views
Server-side validation logic
Step 1: Update Your Model with Validation Attributes
Open your BlogPost model (Models/BlogPost.cs):
using System.ComponentModel.DataAnnotations;
namespace MyMvcApp.Models
{
public class BlogPost
{
public int Id { get; set; }
[Required(ErrorMessage = "Title is required")]
[StringLength(100, ErrorMessage = "Title cannot be longer than 100 characters")]
public string Title { get; set; } = string.Empty;
[Required(ErrorMessage = "Content is required")]
[DataType(DataType.MultilineText)]
public string Content { get; set; } = string.Empty;
public DateTime CreatedAt { get; set; } = DateTime.Now;
}
}
Step 2: Update Views to Show Validation Messages
ASP.NET MVC uses Tag Helpers to automatically display validation messages when a form is submitted with invalid data.
1. Update Views/Blog/Create.cshtml
Ensure each input field has a validation message:
@model MyMvcApp.Models.BlogPost
@{
ViewData["Title"] = "Create Post";
}
<h2>Create New Blog Post</h2>
<form asp-action="Create">
<div class="form-group">
<label asp-for="Title"></label>
<input asp-for="Title" class="form-control" />
<span asp-validation-for="Title" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Content"></label>
<textarea asp-for="Content" class="form-control" rows="5"></textarea>
<span asp-validation-for="Content" class="text-danger"></span>
</div>
<button type="submit" class="btn btn-primary">Save</button>
</form>
2. Update Views/Blog/Edit.cshtml the same way
Make sure validation messages are shown:
@model MyMvcApp.Models.BlogPost
@{
ViewData["Title"] = "Edit Post";
}
<h2>Edit Blog Post</h2>
<form asp-action="Edit">
<input type="hidden" asp-for="Id" />
<div class="form-group">
<label asp-for="Title"></label>
<input asp-for="Title" class="form-control" />
<span asp-validation-for="Title" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Content"></label>
<textarea asp-for="Content" class="form-control" rows="5"></textarea>
<span asp-validation-for="Content" class="text-danger"></span>
</div>
<button type="submit" class="btn btn-primary">Update</button>
</form>
Step 3: Ensure Validation is Enabled in Program.cs
By default, validation is enabled in ASP.NET Core MVC, but let’s double-check.
In Program.cs, ensure that this line is present:
builder.Services.AddControllersWithViews();
Step 4: Test the Validation
Run your app.
Navigate to /Blog/Create and try submitting the form without entering any data.
You should see error messages like:
"Title is required"
"Content is required"
Try entering very long text in the title field — you’ll see the max length validation kicks in.
Validation prevents invalid data from being saved to the database.
Optional: Add Bootstrap Styling (Better UX)
To make validation errors more visible, include Bootstrap in _Layout.cshtml.
Add to Views/Shared/_Layout.cshtml inside <head>:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
Now validation messages will appear styled and easy to read.
Bonus: Try Invalid Data Submission
Try submitting a post with:
Empty title or content
Very long title (more than 100 characters)
Observe:
Form doesn't submit
Validation messages appear
No database update occurs