Search code examples
c#html.net-corerazor

Html date value issue with Razor page


I have a database where I store date validity while creating a new project.

I'm using the html date and set the value to the current time.

<div class="form-group">
                    <label asp-for="Project.PermitDate" class="control-label">Date de délivrance du permis</label>
                    <input type="date" value="@Model.CurrentDate" id="ProjectDateInput" asp-for="Project.PermitDate" class="form-control" />
                    <span asp-validation-for="Project.PermitDate" class="text-danger"></span>
                    <p>Date d'expiration(+5ans): <span id="ProjectDateShow"></span></p>
                </div>

And I'm doing the same if the user want to modify the date

<div class="form-group">
                        <label asp-for="Project.PermitDate" class="control-label">Date de délivrance du permis</label>
                        <input type="date" value="@Model.Project.PermitDate" id="ProjectDateInput" asp-for="Project.PermitDate" class="form-control" />
                        <span asp-validation-for="Project.PermitDate" class="text-danger"></span>
                        <p>Date de délivrance du permis: @Model.Project.PermitDate</p>
                        <p>Date de d'expiration(+5ans): @Model.Project.PermitDate</p>
                        <p>Date d'expiration(+5ans): <span id="ProjectDateShow"></span></p>
                    </div>

But there is a problem, there is no value inside the html date input. Date value not set So the user need to enter the date each time he want to modify the project. Even if he doesn't change the date because the input show jj / mm / aaaa (it's in french for yyyy / MM /dd)

Can some one know how to convert c# DateTime to a format for HTML and have the default value from the database ?
Thank you


All the Edit page HTML

<div>
    <a asp-page="./Projects" class="btn btn-danger">
        <i class="bi bi-backspace-fill"></i>
    </a>
</div>
<h1 class="text-center">Nouveau projet</h1>

<hr />
<div class="d-flex justify-content-center align-items-center w-100 mt-5">
    <div class="w-75">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>

            <div class="card mb-2 p-3">

                <h2 class="h3 text-center">Générale</h2>

                <div class="form-group">
                    <label asp-for="Project.FolderReference" class="control-label">Numero de dossier</label>
                    <input asp-for="Project.FolderReference" class="form-control" />
                    <span asp-validation-for="Project.FolderReference" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Title" class="control-label">Titre</label>
                    <input asp-for="Project.Title" class="form-control" />
                    <span asp-validation-for="Project.Title" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Status" class="control-label">Statut</label>
                    <select class="custom-select mr-sm-2" asp-for="Project.Status">
                        <option selected value="OnGoing">En cours</option>
                        <option value="Stopped">Arrêté</option>
                    </select>
                    <span asp-validation-for="Project.Status" class="text-danger"></span>
                </div>

                <div class="form-group">
                    <label asp-for="Project.PermitDate" class="control-label">Date de délivrance du permis</label>
                    <input type="date" value="@Model.Project.PermitDate" id="ProjectDateInput" asp-for="Project.PermitDate" class="form-control" />
                    <span asp-validation-for="Project.PermitDate" class="text-danger"></span>
                    <p>Date de délivrance du permis: @Model.Project.PermitDate</p>
                    <p>Date de d'expiration(+5ans): @Model.Project.PermitDate</p>
                    <p>Date d'expiration(+5ans): <span id="ProjectDateShow"></span></p>
                </div>

                <div class="form-group">
                    <label asp-for="Project.ProjectType" class="control-label">Type de projet</label>
                    <input asp-for="Project.ProjectType" class="form-control" />
                    <span asp-validation-for="Project.ProjectType" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.LandRegistrer" class="control-label">Cadastre</label>
                    <input asp-for="Project.LandRegistrer" class="form-control" />
                    <span asp-validation-for="Project.LandRegistrer" class="text-danger"></span>
                </div>




                <div class="form-group">
                    <label asp-for="Project.ProjectPhase" class="control-label">Phase du projet</label>

                    <select class="custom-select mr-sm-2" asp-for="Project.ProjectPhase">
                        <option selected value="CP">CP (Création projet)</option>
                        <option value="CE">CE (Contrat transmis)</option>
                        <option value="CS">CS (Contrat signé)</option>
                        <option value="ES">ES (Esquisse)</option>
                        <option value="AP">AP (Avant projet)</option>
                        <option value="PU">PU (Permis urbanisme)</option>
                        <option value="PE">PE (Plan d'éxécution)</option>
                        <option value="AO">AO (Appel d'offre)</option>
                        <option value="CT">CT (Contrôle des travaux)</option>
                        <option value="RP">RP (Réception provisoire)</option>
                        <option value="PEB">PEB</option>
                        <option value="SAV">SAV</option>
                        <option value="END">END (Archivable)</option>
                    </select>

                    <span asp-validation-for="Project.ProjectPhase" class="text-danger"></span>
                </div>

                <div class="form-group">
                    <label asp-for="Project.BillPhase" class="control-label">Phase de facturation</label>
                    <select class="custom-select mr-sm-2" asp-for="Project.BillPhase">
                        <option selected value="ES">ES (Esquisse)</option>
                        <option value="AP">AP (Avant projet)</option>
                        <option value="PU">PU (Permis urbanisme)</option>
                        <option value="PE">PE (Plan d'éxécution)</option>
                        <option value="AO">AO (Appel d'offre)</option>
                        <option value="CT">CT (Contrôle des travaux)</option>
                        <option value="RP">RP (Réception provisoire)</option>
                        <option value="PEB">PEB</option>
                    </select>
                    <span asp-validation-for="Project.BillPhase" class="text-danger"></span>
                </div>

                <div class="form-group">
                    <label asp-for="Project.BillPhaseState" class="control-label">Phase de facturation</label>
                    <select class="custom-select mr-sm-2" asp-for="Project.BillPhaseState">
                        <option selected value="Facturable">Facturable</option>
                        <option value="Emise">Facture émise</option>
                        <option value="Soldé">Facture soldé</option>
                    </select>
                    <span asp-validation-for="Project.BillPhaseState" class="text-danger"></span>
                </div>

            </div>
            <div class="card mb-2 p-3">
                <h2 class="h3 text-center">Personnes responsable du projet</h2>
                <div class="form-group">
                    <label asp-for="Project.Groupe" class="control-label">Groupe</label>
                    <input asp-for="Project.Groupe" class="form-control" />
                    <span asp-validation-for="Project.Groupe" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Person01" class="control-label">Archi Front</label>
                    <input asp-for="Project.Person01" class="form-control" />
                    <span asp-validation-for="Project.Person01" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Person02" class="control-label">Archi back 1</label>
                    <input asp-for="Project.Person02" class="form-control" />
                    <span asp-validation-for="Project.Person02" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Person03" class="control-label">Archi back 2</label>
                    <input asp-for="Project.Person03" class="form-control" />
                    <span asp-validation-for="Project.Person03" class="text-danger"></span>
                </div>
            </div>

            <div class="card mb-2 p-3">
                <h2 class="h3 text-center">Adresse</h2>
                <div class="form-group">
                    <label asp-for="Project.Street" class="control-label">Adresse</label>
                    <input asp-for="Project.Street" class="form-control" />
                    <span asp-validation-for="Project.Street" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.StreetNumber" class="control-label">Numéro</label>
                    <input asp-for="Project.StreetNumber" class="form-control" />
                    <span asp-validation-for="Project.StreetNumber" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.StreetBox" class="control-label">Boite</label>
                    <input asp-for="Project.StreetBox" class="form-control" />
                    <span asp-validation-for="Project.StreetBox" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.ZipCode" class="control-label">Code Postal</label>
                    <input asp-for="Project.ZipCode" class="form-control" />
                    <span asp-validation-for="Project.ZipCode" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Locality" class="control-label">Localité</label>
                    <input asp-for="Project.Locality" class="form-control" />
                    <span asp-validation-for="Project.Locality" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Region" class="control-label">Région</label>
                    <input asp-for="Project.Region" class="form-control" />
                    <span asp-validation-for="Project.Region" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Country" class="control-label">Pays</label>
                    <input asp-for="Project.Country" class="form-control" />
                    <span asp-validation-for="Project.Country" class="text-danger"></span>
                </div>
            </div>
            <div class="card mb-2 p-3">
                <h2 class="h3 text-center">Budget</h2>
                <div class="form-group">
                    <label asp-for="Project.TotalBudget" class="control-label">Budget Total</label>
                    <input asp-for="Project.TotalBudget" class="form-control" />
                    <span asp-validation-for="Project.TotalBudget" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.ConstructionBudget" class="control-label">Budget construction</label>
                    <input asp-for="Project.ConstructionBudget" class="form-control" />
                    <span asp-validation-for="Project.ConstructionBudget" class="text-danger"></span>
                </div>
                <div class="form-group">
                    <label asp-for="Project.Fees" class="control-label">Honoraire</label>
                    <input asp-for="Project.Fees" class="form-control" />
                    <span asp-validation-for="Project.Fees" class="text-danger"></span>
                </div>

            </div>

            <div class="form-group">
                <p>Utilisateur assigné: @User.Identity.Name</p>
                <p>Date de création: @Model.CurrentDate </p>
            </div>

            <input asp-for="Project.CreationDate" type="hidden" />
            <input asp-for="Project.UserCreation" type="hidden" />
            <input asp-for="Project.ModificationDate" value="@Model.CurrentDate" type="hidden" />
            <input asp-for="Project.UserModification" value="@User.Identity.Name" type="hidden" />
            <input asp-for="Project.ProjectId"  type="hidden" />
            <input asp-for="Project.ClientId" type="hidden"/>


            <div class="d-flex justify-content-center align-items-center w-100">
                <input type="submit" value="Modifier" class="btn btn-info w-25" />
            </div>
        </form>
    </div>
</div>

<div>
    <a asp-page="./Projects" class="text-danger"><i class="bi bi-list"></i> Retour à la liste</a>
</div>

All the Edit page HTML.CS

    using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using ArchiProjectManager.Models;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.EntityFrameworkCore;


namespace ArchiProjectManager.Pages.Users.Clients.Projects
{
    [Authorize]
    public class EditProjectModel : PageModel
    {
        private readonly ArchiProjectManager.Data.ApplicationDbContext _context;

        public EditProjectModel(ArchiProjectManager.Data.ApplicationDbContext context)
        {
            _context = context;
        }
        [BindProperty]
        public ModelForProjects Project { get; set; }
        public DateTime CurrentDate = DateTime.Now;
        public DateTime permitDate{get; set;}


        public async Task<IActionResult> OnGetAsync(int? id)
        {
            if(id == null)
            {
                return NotFound();
            }

            
            Project = await _context.ModelForProjects.FirstOrDefaultAsync(p => p.ProjectId == id);
             

            
            

            if ((Project.UserCreation != User.Identity.Name) || (Project.UserModification != User.Identity.Name))
            {
                return RedirectToPage("/Users/AccessDenied");
            }


            if (Project == null)
            {
                return NotFound();
            }

            return Page();

        }



        public async Task<IActionResult> OnPostAsync()
        {
            _context.Attach(Project).State = EntityState.Modified;

            try
            {
                await _context.SaveChangesAsync();
            }
            catch (DbUpdateConcurrencyException)
            {
                if (!ProjectExists(Project.ProjectId))
                {
                    return NotFound();
                }
                else
                {
                    throw;
                }
            }

            return RedirectToPage("./Projects");
        }

        private bool ProjectExists(int id)
        {
            return _context.ModelForProjects.Any(e => e.ProjectId == id);
        }

    }
}

Solution

  • Found the solution, we just need to use min instead of value

    <input type="date" min="@PermitDateTimeFormatted" id="ProjectDateInput" asp-for="Project.PermitDate" class="form-control" />