如何在ASP.NET MVC 5中动态添加新行

我正在寻找如何在ASP.NET MVC 5应用程序的Create Razor视图中为Invoice类添加新行的LineItem.我已经阅读了几乎所有类似的问题,但没有人解决了我认为是一个简单的用例.

这是我的发票模型类

public class Invoice
    {
        public int Id { get; set; }
        public int InvoiceNumber { get; set; }
        public List<LineItem> LineItems { get; set; }
        public Client Customer { get; set; }
        public DateTime DateCreated { get; set; }        
        public decimal Total { get; set; }            


        public Invoice()
        {
            LineItems = new List<LineItem>();
        }

注意,此发票包含LineItems列表,每个行项都是一个简单的对象.并在发票构造函数中创建行项列表.
这是LineItem类

public class LineItem
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Description { get; set; }
        public int Quantity { get; set; }
        public decimal Price { get; set; }        
        public decimal Total { get; set; }

    }

生成的asp.net mvc 5 razor视图未识别对象的LineItems列表,并且没有为其创建任何条目.我想动态地向下表添加一行,我想制作该行的行项目实例.
以下是发票前端显示表格

<table class="table table-condensed" id="invoiceTable"> 
      <thead>
         <tr id="invoiceTableHead">
             <td><strong>Item Name</strong></td>
             <td class="text-center"><strong>Item Description</strong></td>
             <td class="text-center"><strong>Item Price</strong></td>
             <td class="text-center"><strong>Item Quantity</strong></td>
             <td class="text-right"><strong>Total</strong></td>
          </tr>
       </thead>

     <tbody>

以下是我尝试使用jquery动态地将行追加到此表,但无法达到想要的效果。

    <script type="text/javascript">
    $("#lineItemButton").click(function () {
        debugger;
        // Create elements dynamically
        var newRow = "<tr><td>'@Html.TextBoxFor(x => x.LineItems, new { ??? What do int public here)'</td></tr>";

        // Add the new dynamic row after the last row
            $('#invoiceTable tr:last').after(newRow);
        });

    </script>

解决方案参考:

1> 如何在ASP.NET MVC 5中动态添加新行

2> MVC3.0动态添加表格的行数并Controller中获取添加数据

posted @ 2022-04-01 16:43  我是一只大菜鸟  阅读(139)  评论(0编辑  收藏  举报