How do I get asp-validation-for in <span> tag to work for all html object in a form

user_13058445 0
Viewed 172

Im trying to do backend validation for a form, using asp-validation-for in a form, see code below, i notice that only one field returns an error when i do not provide data in the form, see also attached result enter image description here

@page
@model MoviesApp.Pages.AddMoviesModel
@{
    ViewData["Title"] = "Add New Movie";

}

<h3>@ViewData["Title"]</h3>
<hr />


@*<a asp-page-handler="MyOnClick">Click Me</a>*@

<div class="row">
    <div class="col-md-6 offset-3">
        <form method="post">
            <div class="mb-3">
                <label for="title" class="form-label">Title</label>
                <input name="Title" type="text" class="form-control" id="title" placeholder="Movie Title" />
                <span asp-validation-for="@Model.Title" class="text-danger"></span>
            </div>
            <div class="mb-3">
                <label for="rate" class="form-label">Rate</label>
                <input name="Rate" type="number" min="1" max="10" class="form-control" id="rate" placeholder="9" />
                <span asp-validation-for="@Model.Rate" class="text-danger"></span>
            </div>
            <div class="mb-3">
                <label for="description" class="form-label">Description</label>
                <textarea name="Description" class="form-control" id="description" rows="3"></textarea>
                <span asp-validation-for="@Model.Description" class="text-danger"></span>
            </div>
            <button type="submit" class="btn btn-success">Add Movie</button>
        </form>
    </div>

</div>

Here's the detail source code for the model bit for the above cshtml, find below code for AddMoviesModel

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using MoviesApp.Data.Models;

namespace MoviesApp.Pages
{

    public class AddMoviesModel : PageModel
    {
        [BindProperty]
        public string Title { get; set; }

        [BindProperty]
        public int Rate { get; set; }

        [BindProperty]
        public string Description { get; set; }

        //[BindProperty]
        // public Movie Movie { get; set; }
        public void OnGet()
        {

            //Title = "Welcome";
          
        }


        //public void OnGetMyOnClick()
        //{
        //    string stophere = "";
        //}

        public IActionResult OnPost()
        {
            string value = $"{Title} - {Rate} - {Description}";

            //string value = $"{Movie.Title} - {Movie.Rate} - {Movie.Description}";

            if (!ModelState.IsValid)
            {
                return Page();
            }

            //return Page();
            return Redirect("Movies");
        }
    }
}
razor-pages asp.net-core asp.net
1 Answers

I was able to resolve it by add the namespace

using System.ComponentModel.DataAnnotations;

and including [Required(ErrorMessage="validation message")],

ideally asp-validation-for in a tag when used as in a .net core 6 Razor pages Web application using visual studio 2022 should work, however in visual studio 2019 running .net core 3.1 razor pages web application it does not thus the need to add the DataAnnotation namespace.

see below solution in model

[BindProperty]
[Required(ErrorMessage = "Please enter Title")]
public string Title { get; set; }

[BindProperty]
public int Rate { get; set; }

[BindProperty]
[Required(ErrorMessage = "Please enter Description")]
public string Description { get; set; }
user_130584450
Related