4

EF を使用した ASP.NET MVC 4 インターネット アプリケーションがあります。

私のモデル: Orders と OrderDetails: 注文と注文詳細

私の見解： オーダービュー

Q: 注文ビューに自分の orderdetails レコードを表示するにはどうすればよいですか? (JS の有無にかかわらず?; Web グリッドまたはテーブルで?)

作成.cshtml

    <div class="editor-label">
        @Html.LabelFor(model => model.OrderDate)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.OrderDate)
        @Html.ValidationMessageFor(model => model.OrderDate)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.OrderNo)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.OrderNo)
        @Html.ValidationMessageFor(model => model.OrderNo)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Total)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Total)
        @Html.ValidationMessageFor(model => model.Total)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.Shipping)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Shipping)
        @Html.ValidationMessageFor(model => model.Shipping)
    </div>
    @*OrderDetails Part - Works only on the Edit part*@
    <table>
        <tr>
            <th>Product</th>
            <th>Unit Price</th>
            <th>Quantity</th>
            <th>Discount</th>
        </tr>
    @foreach (OrderDetails item in Model.OrderDetails.OrderBy(d=>d.Products.ProductName))
    {
        <tr>
            <td>@item.Products.ProductName</td>
            <td>@item.UnitPrice</td>
            <td>@item.Quantity</td>
            <td>@item.Discount</td>
            <td>
                @Html.ActionLink("Edit", "Edit", "OrderDetails", new { id = item.OrderDetailId }, new { }) |
                @Html.ActionLink("Details", "Details", "OrderDetails", new { id = item.OrderDetailId }, new { }) |
                @Html.ActionLink("Delete", "Delete", "OrderDetails", new { id = item.OrderDetailId }, new { })
            </td>
        </tr>  
    }
    </table>

    <p>
        <input type="submit" value="Create" />
    </p>
4

1 に答える 1

3

これを実現するには、ビューモデルを使用する必要があります。ビジネス モデルをビューに直接公開しないでください。代わりにビューモデルを使用して、別のレベルの抽象化を提供します。

したがって、モデルをまったく変更しないでください。ビューのビュー モデルを定義します。ビューモデルにすべてのフィールドを含めるわけではありません。

/* Viewmodel for your Order/Create page */
public class OrderCreate
{
    /* Attributes for your order */
    public string OrderDate          { get; set; }
    public string OrderNo            { get; set; }
    public string Shipping           { get; set; }
    ....
    ....

    /* List that will contain all details */
    public IList<ProductDetail> ProductDetails      { get; set; }

}

/* Viewmodel for each of the products */ 
public class ProductDetail
{
    public string Product            { get; set; }
    public string UnitPrice          { get; set; }
    public string Quantity           { get; set; }
    ....
    ....
}

GET アクションで、ビジネス モデルではなく、このビューモデルをビューに返します。

//
// GET: /Order/Create

public ActionResult Index()
{
    /* New viewmodel for your view */
    var viewModel = new OrderCreate();
    viewModel.ProductDetails = new List<ProductDetail>();

    /* Assuming the number of products is static */
    for(int i = 0; i < NUMBER_OF_PRODUCTS; i++)
    {
        viewModel.ProductDetails.Add( new ProductDetail() );
    }

    return View(viewModel);
}

このビューモデルを使用すると、ビューに入力された値にアクセスできるようになりました。ビューをポスト アクションにポストバックするときは、ビューモデルのデータを使用してビジネス モデルを作成します。

//
// POST: /Order/Create

[HttpPost]
public ActionResult Index(OrderCreate viewModel)
{
    if(ModelState.IsValid))
    {
        var model = new Order();

        //TODO: Populate model through viewmodel, loop viewModel.ProductDetails

        return RedirectToAction("Index");
    }

    // Model is not valid
    return View(viewMode);
}

ビューモデルを実際のモデルにマッピングすることに飽きたら、AutoMapperを試してみてください。

それが役に立てば幸い。

于 2012-09-22T12:57:27.657 に答える