2016-01-20 32 views
1

我正在構建一個電子商務應用程序,現在正在處理ProductAttributes。我想處理大小和顏色和數量屬性。Asp.Net MVC - 在數據庫中插入多行

示例 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模式,沒有我上面的表。

我已經直接在數據庫中插入了一些值,一切工作正常。獲得理想的結果。但顯然我希望我的用戶使用ViewPage存儲這些細節。

我創建了一個視圖模型

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; } 
} 

位指示我必須將數據插入到表複式。所以他是我的控制器

[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"); 
    } 

一切都很好。數據存儲在所有具有外鍵和所有值的表中。現在我想添加動態文本字段來添加大小和顏色。

我已經存儲在數據庫和控制器中的顏色和大小我在dropdownlist中傳遞這些值並填充它們。

查看

@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>

回答

1

如果我理解你糾正你在你的視圖模型的屬性列表。

所以如果你想使用它,你應該把它放在列表中。

所以,你應該改變你的視圖模型:

//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做正確的約束。使用HtmlHelpersHtml.DropDownListForHtml.HiddenForHtml.TextBoxFor將更容易。我在視圖中看不到它。

事情是,如果你創建你的input s與幫手他們會得到正確name屬性和您的模型將正確綁定POST

你將要面對的另一件事是動態地創建新的項目,如你的例子。你應該考慮正確的名字屬性。我建議你檢查this great answer這個問題。

+0

我用VIEW更新了我的問題。 – user3223395667

+0

,我猜'AttributeViewModel'也會有'ProductId'和'Quantity' – user3223395667

+0

@ user3223395667它取決於你的實現。但是你在那裏應該有'數量'的確定。我的壞 –

相關問題