如何在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中獲取添加數據