c# - Asp.Net MVC - 在数据库中插入多行

Question

我正在构建一个电子商务应用程序，现在正在处理 ProductAttributes。我想处理尺寸、颜色和数量属性。

例子T 恤有多种颜色和尺寸，数量也不同。

 Name    - Color - Size  - Qty
T-shirtA - Black - Small - 5pc
T-shirtA - Blue - Medium - 10pc
T-shirtA - Blue - Large -  4pc

我想处理上述情况。

表格

1. Product: Product_Id(pk), Name, Price, Description

2. ProductSizes: ProductSize_Id(pk), SizeName

3. ProductSizeValues: ProductSizeValue_Id(pk), ProductSize_Id(fk), Name

4. ProductColors: ProductColor_Id(pk), Name

5. ProductAttribues: ProductAttribute_Id(pk), ProductSize_Id(fk), ProductColor_Id(fk)

6. ProductAttribueValues: ProductAttributeValue_Id(pk), ProductAttribute_Id(fk), Product_Id(fk), ProductSizeValue_Id(fk), ProductColor_Id(fk), Quantity.

首先我对如何用数量存储颜色和尺寸感到困惑，然后我安装了 OpenCart 并看到了他们的 DB Schema 并且没有我上面的表格。

我已将一些值直接插入到数据库中，一切正常。得到想要的结果。但显然我希望我的用户使用 ViewPage 存储这些详细信息。

我创建了一个ViewModel

ProductAttributeViewModel.cs

public class ProductAttributesViewModel
{
    public Product Product { get; set; }
    public ProductAttribute ProductAttribute { get; set; }
    public ProductAttributeValue ProductAttributeValue { get; set; }
    public int ProductId { get; set; }
    public string Name { get; set; }
    [AllowHtml]
    public string Description { get; set; }
    public decimal? Price { get; set; }
    public int? Quantity { get; set; }
    public string Sizes { get; set; }
    public int Stock { get; set; }
    public int ProductColorVariantId { get; set; }
    public int ProductSizeVariantId { get; set; }
    public int ProductSizeVariantValueId { get; set; }
    public int ProductAttributeId { get; set; }
    public int ProductAttributeValueId { get; set; }
}

Contoller 我必须将数据插入到多个表中。所以他是我的 Controller

[HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult AddProduct(ProductAttributesViewModel newRecord)
    {
IEnumerable<SelectListItem> productsizevariants = db.ProductSizeVariants.Select(c => new SelectListItem
        {
            Value = c.ProductSizeVariantId.ToString(),
            Text = c.Name

        });
        ViewBag.ProductSizeVariantId = productsizevariants;

        IEnumerable<SelectListItem> productsizevariantsvalues = db.ProductSizeVariantValues.Select(c => new SelectListItem
        {
            Value = c.ProductSizeVariantValueId.ToString(),
            Text = c.Name

        });
        ViewBag.ProductSizeVariantValueId = productsizevariantsvalues;

        IEnumerable<SelectListItem> productcolorvariantsid = db.ProductColorVariants.Select(c => new SelectListItem
        {
            Value = c.ProductColorVariantId.ToString(),
            Text = c.Name

        });
        ViewBag.ProductColorVariantId = productcolorvariantsid;

                    var product = new Product
                    {
                        Name = newRecord.Name,
                        Description = newRecord.Description,
                        Price = newRecord.Price,
                    };

                    var productattributes = new ProductAttribute
                    {
                        ProductSizeVariantId = newRecord.ProductSizeVariantId,
                        ProductColorVariantId = newRecord.ProductColorVariantId,
                        ProductId = newRecord.ProductId
                    };

                    var productattributevalues = new ProductAttributeValue
                    {
                        ProductAttributeId = newRecord.ProductAttributeId,
                        ProductId = newRecord.ProductId,
                        ProductSizeVariantId = newRecord.ProductSizeVariantId,
                        ProductSizeVariantValueId = newRecord.ProductSizeVariantValueId,
                        ProductColorVariantId = newRecord.ProductColorVariantId,
                        Quantity = newRecord.Stock
                    };

                    db.Products.Add(product);
                    db.ProductAttributes.Add(productattributes);
                    db.ProductAttributeValues.Add(productattributevalues);
                    db.SaveChanges();
                    return RedirectToAction("Index", "Home");
  }

一切正常。数据存储在具有外键和所有值的所有表中。现在我想添加动态文本字段以添加尺寸和颜色。

我将颜色和尺寸存储在数据库中，并从 Controller 中将这些值传递到下拉列表中并填充它们。

查看

@model FypStore.ViewModels.ProductAttributesViewModel

@using (Html.BeginForm("AddProduct", "Store", FormMethod.Post, new { enctype = "multipart/form-data", @class = "form-horizontal col-md-12", role = "form" }))
{
<div class="form-group">
    @Html.LabelFor(m => m.Name, new { @class = "col-md-2 control-label", data_val_required = "required" })
    <div class="col-md-10">
        @Html.TextBoxFor(m => m.Name, new { @class = "form-control" })
        @Html.ValidationMessageFor(m => m.Name)
    </div>
</div>
<div class="form-group">
    @Html.LabelFor(m => m.Description, new { @class = "col-md-2 control-label" })
    <div class="col-md-10">
        @Html.TextAreaFor(m => m.Description, new { @class = "form-control" })
    </div>
</div>
<div class="form-group">
    <div class="row">

         @*@Html.LabelFor(m => m.ProductSizeVariantId, new { @class = "col-md-2 control-label" })*@
        <div class="col-md-2 control-label">

        </div>
            <div class="input_fields_wrap">
                <button class="add_field_button">Add More Fields</button>
                <div class="col-md-2">
                    @Html.DropDownList("ProductSizeVariantId", null, "Size", new { @class = "control-label" })
                </div>
                <div class="col-md-2">
                    @Html.DropDownList("ProductSizeVariantValueId", null, "Select Size", new { @class = "control-label" })
                </div>
                <div class="col-md-2">
                    @Html.DropDownList("ProductColorVariantId", null, "Select Color", new { @class = "control-label" })
                </div>
                <div class="col-md-2">
                    @Html.TextBoxFor(x => x.Stock, new { @placeholder = "Quantity", @class = "form-control" })
                </div>
            </div>
    </div>
</div>
<div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" class="btn btn-default" value="Create Product" />
            </div>
        </div>
        }

这是我想要实现的演示。

$('.multi-field-wrapper').each(function() {
    var $wrapper = $('.multi-fields', this);
    $(".add-field", $(this)).click(function(e) {
        $('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').placeholder('quantity').focus();
    });
    $('.multi-field .remove-field', $wrapper).click(function() {
        if ($('.multi-field', $wrapper).length > 1)
            $(this).parent('.multi-field').remove();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form role="form" action="/wohoo" method="POST">
  <input type="text" placeholder="Name" name="name"><br />
  <input type="text" placeholder="Price" name="price"><br />
  <input type="text" placeholder="Description" name="description"><br />
  <label>Attributes</label>
    <div class="multi-field-wrapper">
      <div class="multi-fields">
        <div class="multi-field">
        
        <select>
        <option>Green</option>
        <option>Blue</option>
        <option>Black</option>
        <option>Purple</option>
        <option>White</option>
        </select>
        <select>
        <option>XS</option>
        <option>Small</option>
        <option>Medium</option>
        <option>Large</option>
        <option>XL</option>
        </select>
          <input type="text" placeholder="quantity" name="quantity">
          <button type="button" class="remove-field">Remove</button>
        </div>
      </div>
    <button type="button" class="add-field">Add field</button>
  </div>
     <button type="button">Create Product</button>
</form>

Answer 1

如果我理解你更正，你的 View 模型中有一个属性列表。

所以如果你想使用它，你应该把它放在列表中。

所以你应该改变你的 View 模型:

//I put all properties of your list to separate model
public class AttriduteViewModel
{
    public int ProductColorVariantId { get; set; }
    public int ProductSizeVariantId { get; set; }
    public int ProductSizeVariantValueId { get; set; }
    public int ProductAttributeId { get; set; }
    public int ProductAttributeValueId { get; set; }
    public int? Quantity { get; set; }
}

public class ProductAttributesViewModel
{
    public Product Product { get; set; }
    public ProductAttribute ProductAttribute { get; set; }
    public ProductAttributeValue ProductAttributeValue { get; set; }
    public int ProductId { get; set; }
    public string Name { get; set; }
    [AllowHtml]
    public string Description { get; set; }
    public decimal? Price { get; set; }
    public string Sizes { get; set; }
    public int Stock { get; set; }
    //note this line
    public List<AttriduteViewModel> AdditionalAttridutes {get; set;}
}

基本上就这些了。现在您应该只为您的 AdditionalAttridutes 进行正确的绑定(bind)。使用 HtmlHelpers(例如 Html.DropDownListFor、Html.HiddenFor 和 Html.TextBoxFor)会更容易实现。我只是在您的 View 中看不到它。

问题是，如果您使用助手创建您的 input，它们将获得正确的 name 属性，并且您的模型将在 POST 上正确绑定(bind)。

您将面临的另一件事是像您的示例中那样动态创建新项目。您应该考虑正确的名称属性。我建议你检查this great answer关于那个问题。