In this tutorial we will add a stand-alone edit page for a single product to the project of our previous tutorials.

Open GridsController.cs and add 2 more action methods:

[ResponseCache(Duration = 0, NoStore = true)]
public async Task<IActionResult> Edit(int? id)
{
    if (!id.HasValue) id = 1;
    var model = await Repository
        .GetById<SimpleProductViewModelDetail, int>(id.Value);
    return View(model);
}
[HttpPost]
public async Task<ActionResult> Edit(SimpleProductViewModelDetail model)
{
 
    if (ModelState.IsValid)
    {
        Repository.Update(false, model);
        await Repository.SaveChanges();
        return RedirectToAction("Edit", new { id = model.Id });
    }
    return View(model);
}

Add also a View for the Edit action methods with the model SimpleProductViewModelDetail and with the following code:

<detail-form asp-for="@Model"
             all-properties="true"
             edit-mode-default="true"
             form-method="POST"
             form-action="@Url.Action("Edit", "Grids")"/>

and with the following js scripts:

@section scripts{
    
    @{ await Html.RenderPartialAsync("_ValidationScriptsPartial"); }
 
    
}

This time there is no need to add another link in the _Layout page, since the edit page must be invoked with a product as parameter. For example .../Grids/Edit/3. Thus just run, and type your url in the browser!

See it live