能夠使用ViewBag動態地將行添加到ViewModel

背景
我正在構建一個簡單的庫存和訂購系統。其中一個訂單Order.cs有多個訂單專案OrderItem。我有一個 ViewModel 。訂單專案的數量也應該更新庫存，但我還沒有走這么遠

楷模

public class Order
    {
        [Key]
        public int Id { get; set; }

        public int TotalItems { get; set; }

        public DateTime DeliveryDate { get; set; }

        public string OrderNumber { get; set; }
        public string DeliveryAddress { get; set; }

        [ForeignKey("ClientId")]
        public int ClientId { get; set; }
        

        public int OrderItemId { get; set; }
        [ForeignKey("OrderItemId")]

        public List<OrderItem> OrderItems { get; set; }
        public Client Client { get; set; }
    }

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

        [ForeignKey("OrderId")]
        public int OrderId{ get; set; }

        [ForeignKey("ItemInfoId")]
        public int ItemInfoId { get; set; }
        
        public int Quantity { get; set; }
        public ItemInfo ItemInfo { get; set; }
        public Order Order { get; set; }
    }

public class OrderViewModel
    {
        //public int OrderId { get; set; }
        //public string OrderNumber { get; set; }
        //public string DeliveryAddress { get; set; }
        //public int ClientId { get; set; }
        //public DateTime Deliverydate { get; set; }
        public Order Order { get; set; }
        public IList<OrderItem> OrderItems { get; set; }
    }

控制器 在單擊創建按鈕時。

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

我CreateMultipleOrderItem()正在作業并給我一些價值。

public IActionResult CreateMultipleOrderItem()
        {
            ViewBag.Item = new SelectList(_context.ItemInfos.ToList(), "Id", "ItemCode");
            ViewBag.Items = JsonConvert.SerializeObject(new SelectList(_context.ItemInfos.ToList(), "Id", "ItemCode"));
            return View();
        }

剃刀視圖

<table id="tblCustomers" class="table" cellpadding="0" cellspacing="0" >
                <h3>Order Items</h3>
                <thead>
                    <tr>
                        <th style="width:150px">Item Code</th>
                        <th style="width:150px">Quantity</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody></tbody>
                <tfoot id="item-list">
                    <tr>
                        <td>
                            <select asp-for="OrderItems[0].ItemInfoId" class="items" asp-items="@ViewBag.Item"></select>
                        </td>
                        <td><input type="text" asp-for="OrderItems[0].Quantity" class="items" /></td>
                        @*<td><input type="button" id="btnAdd" value="Add" /></td>*@
                    </tr>
                </tfoot>
            </table>
            <button id="add">Add another item</button>
@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.10.2.js" type="text/javascript"></script>
    <script>
        $("#add").click(function (e) {
           e.preventDefault();
           var i = ($(".items").length) / 2;
           var model = @Html.Raw(@ViewBag.Items);
            var n = '<tr><td><select id ="OrderItems_'   i   '_ItemInfoId" name="OrderItems['   i   '].ItemInfoId" class="items"></select></td>'  
                '<td><input type="text" class="items" name="OrderItems['   i   '].Quantity" /></td>' 
                '<td><button type="button" class="deletebtn">Delete</button></td></tr>
'

           $("#item-list").append(n);

           var Items = "";
           $(model).each(function (e) {
               Items = Items   '<option value="'   this.Value   '">'   this.Text   '</option>'
           });

           var subItemList = $("#OrderItems"   1   "_ItemInfoId");
            subItemList.empty();
            subItemList.append(Items);
    });
    </script>

}

我現在看到了這個，不知道為什么添加新行時，我的 ViewBag 專案沒有回傳到 Select 串列中。

我被困在這里好幾天了，這是迄今為止我最接近的一次。如果有人可以幫助我，我真的很感激。

uj5u.com熱心網友回復：

var subItemList = $("#OrderItems" 1 "_ItemInfoId");

根據您的代碼： <select id ="OrderItems_' i '_ItemInfoId" name="OrderItems[' i '].ItemInfoId" ></select>

將id更改為與select中的id一致，如下所示：

 var subItemList = $("#OrderItems_"   i   "_ItemInfoId");

結果：

標籤：jQuery 网 asp.net-mvc asp.net 核心 剃刀

上一篇：如何用javascript寫一個簡單的選框效果

下一篇：當點擊一個標簽改變重定向頁面的背景顏色？