asp.net-core-mvc - 选定的下拉值如何从视图组件保存到主模型？

问题描述

ASP.NET Core 5 MVC Web 应用程序。问题是它是如何工作的，而不是为什么它不工作。我不明白这个机制，所以不想看到它在未来因一些“快乐的手指”编码事故而失败......

我有一个控制器在创建时期望的主要模型：

public class ProductCategory : BaseClass
{
    public int ProductId { get; set; }
    public virtual Product Product { get; set; }

    public int CategoryId { get; set; }
    public virtual Category Category { get; set; }
}

（BaseClass只有典型的记录保存字段）。

我有一个视图组件的模型；我需要两个，每个下拉菜单一个，所以您可以轻松想象另一个，修改名称以保护无辜者......：

类别：

public class CategoryList
{
    public CategoryList()
    {
        Categories = new List<Category>();
    }

    public int CategoryId { get; set; }

    [DisplayName("Categories")]
    public List<Category> Categories { get; set; }
}

类别视图组件：

public class CategoryDropdownViewComponent : ViewComponent
{
    private readonly ApplicationDbContext _db;

    public CategoryDropdownViewComponent(ApplicationDbContext context)
    {
        _db = context;
    }

    public async Task<IViewComponentResult> InvokeAsync()
    {
        var items = await GetCategoriesAsync();
        var TheView = "Default";
        var list = new CategoryList();

        if (items.Count == 0)
        {
            TheView = "CategoryMaintenanceLink";
        }
        else
        {
            items.Insert(0, new Category() { Id = 0, Name = "-- Please select an option --" });
            list.Categories = items;
        }

        return View(TheView, list);
    }

    private Task<List<Category>> GetCategoriesAsync()
    {
        return _db.Category.ToListAsync();
    }
}

以及类别的默认视图（我将这个及以上存储在中~\Shared\Components\CategoryDropdown\）：

@model CoolestProjectNameEver.Models.CategoryList

<p>
    @Html.DropDownListFor(model => model.CategoryId, new SelectList(Model.Categories, "Id", "Name"), new { @class = "form-control" })
</p>

所以，在我的控制器中，我开始创建：

    public IActionResult Create()
    {
        return View();
    }

在Create视图中，除其他外，我启动了视图组件：

        <div class="form-group">
            <label asp-for="ProductId" class="control-label"></label>
            @await Component.InvokeAsync("ProductDropdown")
        </div>
        <div class="form-group">
            <label asp-for="CategoryId" class="control-label"></label>
            @await Component.InvokeAsync("CategoryDropdown")
        </div>

所有作品和下拉列表都已填满。我可以为两者选择选项。现在是未知部分。

关于POST方法Create：

    [HttpPost]
    [ValidateAntiForgeryToken]
    public async Task<IActionResult> Create(ProductCategory productCategory)
    {
        try
        {
            if (ModelState.IsValid)        <--- breakpoint
            {
                _context.Add(productCategory);
                await _context.SaveChangesAsync();
                return RedirectToAction(nameof(Index));
            }
        }
        catch (Exception ex)
        {
            Console.WriteLine(ex.ToString());
        }

        return View(productCategory);
    }

CategoryId断点将显示和的正确选择值ProductId。

所以问题是，这是否因为 VC 模型与主控制器模型中的名称匹配而起作用，并且它以某种方式自动填充？

1如果我的ViewComponent模型有，SelectedValueId而不是CategoryId，那么它会因为不匹配而失败？

2异步中单独模型的值如何ViewComponent在回发时插入主模型？

标签： asp.net-core-mvcasp.net-core-viewcomponent

实际上，如果您将Create视图代码更改为：

  <div class="form-group">
        @await Component.InvokeAsync("ProductDropdown")
    </div>
    <div class="form-group">
        @await Component.InvokeAsync("CategoryDropdown")
    </div>

它也将成功绑定。

asp.net core 中的模型绑定是根据name. 如果名称匹配，则相应的属性将绑定到模型。

在您的 ViewComponent 中，您的代码（model => model.CategoryId）：

 @Html.DropDownListFor(model => model.CategoryId, new SelectList(Model.Categories, "Id", "Name"), new { @class = "form-control" })

会name =CategoryId在生成的html代码中给出

那么名称CategoryId也在你的ProductCategory模型中，如果它们的名称匹配，则绑定成功。

asp.net-core-mvc - 选定的下拉值如何从视图组件保存到主模型？

问题描述

解决方案

推荐阅读