send the form via AJAX and do its validation via fluentValidation - asp.net-core

Question

I want to send the form via AJAX and do its validation via fluentValidation in mvc core. Please guide me about this

Answer 1

Here is a working demo , you could refer to :
Add a reference to the FluentValidation.AspNetCore assembly by installing the appropriate NuGet package:
Install-Package FluentValidation.AspNetCore
Configure FluentValidation in your app’s Startup class by calling the AddFluentValidation extension method inside the ConfigureServices method , and use the AddFromAssemblyContaining method to automatically register all validators within a particular assembly
services.AddMvc()
.AddFluentValidation(fv => {
fv.RegisterValidatorsFromAssemblyContaining<PersonValidator>();
//If you want to disable this behaviour so that FluentValidation is the only validation library that executes,
//you can set the RunDefaultMvcValidationAfterFluentValidationExecutes to false in your application startup routine
fv.RunDefaultMvcValidationAfterFluentValidationExecutes = false;
})
.SetCompatibilityVersion(CompatibilityVersion.Version_2_2);
Assume that the PersonValidator is defined to validate a class called Person
public class Person
{
public int Id { get; set; }
public string Name { get; set; }
public string Email { get; set; }
public int Age { get; set; }
}
public class PersonValidator : AbstractValidator<Person>
{
public PersonValidator()
{
RuleFor(x => x.Id).NotNull();
RuleFor(x => x.Name).Length(0, 10);
RuleFor(x => x.Email).EmailAddress();
RuleFor(x => x.Age).InclusiveBetween(18, 60);
}
}
Controller
[HttpPost]
public async Task<IActionResult> CreatPerson(Person person)
{
if (!ModelState.IsValid)
{ // re-render the view when validation failed.
return BadRequest();
}
//Save the person to the database, or some other logic
_context.Add(person);
await _context.SaveChangesAsync();
var message = "Person successfully created";
return Ok(message);
}
View and related jQuery
#model TestExample.Models.Person
<hr />
<div class="row">
<div class="col-md-4">
<form id="formdata">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="Name" class="control-label"></label>
<input asp-for="Name" class="form-control" />
<span asp-validation-for="Name" 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="Age" class="control-label"></label>
<input asp-for="Age" class="form-control" />
<span asp-validation-for="Age" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" value="Create" class="btn btn-primary" />
</div>
</form>
</div>
#section Scripts {
#{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
<script>
$("#formdata").submit(function (e) {
e.preventDefault();
var form = $(this);
$.ajax(
{
type: "post",
url: "/people/CreatPerson",
data: form.serialize(),
success: function (data) { alert(data); },
error: function (data) { alert(data); }
});
});
</script>
}
For more details on FluentValidation , you could refer to https://fluentvalidation.net/aspnet