title: Thymeleaf + jQuery , how to properly add th:field="*{value}"
body: <p>I am struggling with a problem. I am trying to dynamically add row to my form. My first row (static) of form is working fine, but when I add another one, the form is being added but I cannot obtain any value, like it would stay empty. Please help</p>
  
  <p><b>OK it is my form:</b></p>
  
  <p></p>
  
  <pre><code>&lt;h2&gt;Risk management&lt;/h2&gt;
      &lt;table class="table table-striped" id="myTable"&gt;
          &lt;tr&gt;
              &lt;th&gt;Type of work&lt;/th&gt;
              &lt;th&gt;Type of threat&lt;/th&gt;
              &lt;th&gt;Person&lt;/th&gt;
              &lt;th&gt;Intial risk&lt;/th&gt;
              &lt;th&gt;Countermeasure&lt;/th&gt;
              &lt;th&gt;Final risk&lt;/th&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
  
              &lt;th&gt;&lt;input type="text" th:field="*{typeOfWork}" /&gt; &lt;/th&gt;
              &lt;th&gt;&lt;input type="text" th:field="*{typeOfThreat}" /&gt; &lt;/th&gt;
              &lt;th&gt;&lt;input type="text" th:field="*{person}" /&gt; &lt;/th&gt;
              &lt;th&gt;&lt;input type="text" th:field="*{initialRisk}" /&gt; &lt;/th&gt;
              &lt;th&gt;&lt;input type="text" th:field="*{countermeasure}" /&gt; &lt;/th&gt;
              &lt;th&gt;&lt;input type="text" th:field="*{finalRisk}" /&gt; &lt;/th&gt;
  
          &lt;/tr&gt;
          &lt;button type="button" onclick="addFields()"&gt;Insert new row&lt;/button&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p><b>When I add row by using jQuery, row is added but the values written in form are not being sent to Model by Thymeleaf</b></p>
  
  <pre><code>&lt;script th:inline="javascript"&gt;
  
  function addFields()
  {
      document.getElementById("myTable").insertRow(-1).innerHTML = 
          '                &lt;th&gt;&lt;input type="text" th:field="*{typeOfWork}" /&gt; &lt;/th&gt;\n' +
          '                &lt;th&gt;&lt;input type="text" th:field="*{typeOfThreat}" /&gt; &lt;/th&gt;\n' +
          '                &lt;th&gt;&lt;input type="text" th:field="*{person}" /&gt; &lt;/th&gt;\n' +
          '                &lt;th&gt;&lt;input type="text" th:field="*{initialRisk}" /&gt; &lt;/th&gt;\n' +
          '                &lt;th&gt;&lt;input type="text" th:field="*{countermeasure}" /&gt; &lt;/th&gt;\n' +
          '                &lt;th&gt;&lt;input type="text" th:field="*{finalRisk}" /&gt; &lt;/th&gt;';
  }
  </code></pre>
  
  <p></p>