title: Dynamic Row of Controls on button click in ASP.NET MVC
body: <p>I have a row of row of controls which are binded to model properties. I want to have a button which creates another row of such controls binded to same properties. Is there any way to achieve this.</p>
  
  <p>Here is the code:
  Model:</p>
  
  <pre><code>public class OrderModel
  {
      public string ProductName { get; set; }
  
      public string Price { get; set; }
      [DataType(DataType.Text)]
      public int Quantity { get; set; }
  
      public int TotalPrice { get; set; }
  
     public  List&lt;ProductModel&gt; productList { get; set; }
  
     public double SubTotalPrice { get; set; }
  
     public double TotalAmount { get; set; }
  
     public int ProductID { get; set; }
  }
  </code></pre>
  
  <p>And here the row of controls:</p>
  
  <pre><code>&lt;tr&gt;
          &lt;td&gt;@Html.DropDownListFor(model =&gt; model.ProductName, new SelectList(Model.productList, "ProductID", "ProductName"), "Select")&lt;/td&gt;
          &lt;td&gt;@Html.EditorFor(model =&gt; model.Price)&lt;/td&gt;
          &lt;td&gt;@Html.EditorFor(model =&gt; model.Quantity)&lt;/td&gt;
          &lt;td&gt;@Html.EditorFor(model =&gt; model.TotalPrice)&lt;/td&gt;
                        &lt;i class="ion-plus-round"
                 style="font-size: 25px;
              color: #e67e22;
              margin-left:5px;
              "&gt;
              &lt;/i&gt;
          &lt;/td&gt;
  </code></pre>
  
  <p></p>