0

我的问题是：如何在 razor 页面和 LINQ 查询（在后端）中构建 html 标记，以在 EDIT 和 CREATE 视图中显示我的所有 SubCategoies 的复选框列表。

允许我创建具有多个子类别的产品并随时在 EDIT 视图中更新它们。

使用 .Net EF Core 2.2，Razor 页面。

主类（产品）：

public class Product
{
    public int Id { get; set; }

    public string Name { get; set; }

    public string Description { get; set; }

    public Category Category { get; set; }

    public List<ProductSubcategory> SubCategories { get; set; }

}

Product 与 Subcategory 具有多对多关系：

public class SubCategory
{
    public int Id { get; set; }
    public string Name { get; set; }
    public List<ProductSubcategory> SubCategories { get; set; }
}

所以连接表（实体）是ProductSubcategory：

 public class ProductSubcategory
{
    public int ProductId { get; set; }
    public Product Product { get; set; }

    public int SubCategoryId { get; set; }
    public SubCategory SubCategory { get; set; }
}

编辑（和创建）产品视图：

 <h2>Editar: @Model.Product.Name</h2>


<form method="post">
    <input type="hidden" asp-for="Product.Id" />
    <div class="form-group">
        <label asp-for="Product.Name"></label>
        <input asp-for="Product.Name" class="form-control" />
        <span class="text-danger" asp-validation-for="Product.Name"></span>
    </div>
    <div class="form-group">
        <label asp-for="Product.Description"></label>
        <textarea asp-for="Product.Description" class="form-control"></textarea>


        <span class="text-danger" asp-validation-for="Product.Description"></span>
    </div>
    <div class="form-group">
        <label asp-for="Product.Category"></label>
        <select class="form-control" asp-for="Product.Category" asp-items="Model.Categories"></select>
        <span class="text-danger" asp-validation-for="Product.Category"></span>
    </div>
    <div class="form-group">

        //Code to allow the subcategory selection.
        //preferable as checkboxes 

        //() subcat1    (x)subcat2    ()subcat3
        //() subcat4    ()subcat5    (x)subcat6

    </div>
    <button type="submit" class="btn btn-primary">Salvar</button>
</form>

Edit.cshtml.cs 页面模型

public class EditModel : PageModel
{
    private readonly IProductData _ProductData;
    private readonly IHtmlHelper _HtmlHelper;
    [BindProperty]
    public Product Product { get; set; }
    public IEnumerable<SelectListItem> Categories { get; set; }
    public string MessageCreate { get; set; }


    public EditModel(IProductData _productData, IHtmlHelper _htmlHelper)
    {
        _ProductData = _productData;
        _HtmlHelper = _htmlHelper;
    }


    public IActionResult OnGet(int? productId)
    {
        Categories = _HtmlHelper.GetEnumSelectList<Category>();

        if (productId.HasValue)
        {
            Product = _ProductData.GetById(productId.Value);

        }
        else
        {
            MessageCreate = "Criar novo Produto";
            Product = new Product();
        }

        if (Product == null)
        {
            return RedirectToPage("./NotFound");
        }
        return Page();
    }

    public IActionResult OnPost()
    {
        if (!ModelState.IsValid)
        {
            Categories = _HtmlHelper.GetEnumSelectList<Category>();
            return Page();
        }

        if (Product.Id > 0)
        {
            _ProductData.Update(Product);
        }
        else
        {
            _ProductData.Create(Product);
        }

        _ProductData.Commit();

        TempData["Message"] = "Produto salvo!!!";

        //PRG POST-REDIRECT-GET
        return RedirectToPage("./Detail", new { productId = Product.Id });
    }

}
4

1 回答 1

0

复选框用于表示布尔属性。我看到你没有 bool 属性，所以我想你需要在SubCategories类中添加一个 Boolean 属性，例如：

public bool IsChecked { get; set; } // added this property

然后您需要向您的 PageModel（编辑或创建）添加一个属性来表示数据并确保发布的值将绑定到它：

[BindProperty]
public List<Subcategory> SubCategories { get; set; } = new List<Subcategory>();

最后，您需要让模型绑定器将每个复选框与特定的子类别相关联。以下代码在 .cshtml 文件中显示了我的示例：

@for (var i = 0; i < Model.SubCategories.Count(); i++)
 {
    <input asp-for="SubCategories[i].IsChecked" />
 }
于 2019-02-24T20:00:04.087 回答