title: Add row in table with jquery which is connected with model in MVC
body: <p>I have this table and shows values from the server.
  How I can with jquery add a new row in this table if I want to send values from the table to the Server</p>
  
  <pre><code>&lt;table id="Products" class="Products"&gt;
      &lt;tr&gt;
          &lt;th&gt;ProductId&lt;/th&gt;
          &lt;th&gt;Productname&lt;/th&gt;
          &lt;th&gt;Quantity&lt;/th&gt;
          &lt;th&gt;UnitPrice&lt;/th&gt;
      &lt;/tr&gt;
  
      @for (int i = 0; i &lt; Model.NorthOrderDetails.Count; i++)
      {
          &lt;tr&gt;
              @Html.HiddenFor(m =&gt; m.NorthOrderDetails[i].ProductID)
              @Html.HiddenFor(m =&gt; m.NorthOrderDetails[i].ProductName)
              &lt;td&gt;@Html.DisplayFor(m =&gt; m.NorthOrderDetails[i].ProductID)&lt;/td&gt;
  
              &lt;td&gt;@Html.DisplayFor(m =&gt; m.NorthOrderDetails[i].ProductName)&lt;/td&gt;
  
              &lt;td&gt;&lt;input type="hidden" name="NorthOrderDetails.Index" value="@i" /&gt; &lt;/td&gt;
  
              &lt;td&gt; @Html.TextBoxFor(m =&gt; m.NorthOrderDetails[i].Quantity) &lt;/td&gt;
  
              &lt;td&gt; @Html.TextBoxFor(m =&gt; m.NorthOrderDetails[i].UnitPrice, String.Format("{0}", Model.NorthOrderDetails[i].UnitPrice))&lt;/td&gt;
              &lt;td&gt;
                  &lt;button type="button" class="delete" data-id="@Model.NorthOrderDetails[i].ProductID"&gt;Delete&lt;/button&gt;&lt;/td&gt;
          &lt;/tr&gt;
      }
  &lt;/table&gt;    
  </code></pre>