「* {値}」フィールド= Thymeleaf + jQueryの、どのように適切に目を追加します

サデック：

私はこの問題に苦しんでいます。私は動的に私のフォームに行を追加しようとしています。フォームの私の最初の行（静的）が正常に動作しているが、私は別のものを追加するとき、フォームが追加されているが、それは空とどまるように私は、任意の値を取得することはできません。助けてください

OK、それは私のフォームです。

<h2>Risk management</h2>
    <table class="table table-striped" id="myTable">
        <tr>
            <th>Type of work</th>
            <th>Type of threat</th>
            <th>Person</th>
            <th>Intial risk</th>
            <th>Countermeasure</th>
            <th>Final risk</th>
        </tr>
        <tr>

            <th><input type="text" th:field="*{typeOfWork}" /> </th>
            <th><input type="text" th:field="*{typeOfThreat}" /> </th>
            <th><input type="text" th:field="*{person}" /> </th>
            <th><input type="text" th:field="*{initialRisk}" /> </th>
            <th><input type="text" th:field="*{countermeasure}" /> </th>
            <th><input type="text" th:field="*{finalRisk}" /> </th>

        </tr>
        <button type="button" onclick="addFields()">Insert new row</button>
    </table>

私はjQueryのを使用して行を追加すると、行が追加されるが、フォームに書き込まれた値は、Thymeleafによってモデルに送信されていません

<script th:inline="javascript">

function addFields()
{
    document.getElementById("myTable").insertRow(-1).innerHTML = 
        '                <th><input type="text" th:field="*{typeOfWork}" /> </th>\n' +
        '                <th><input type="text" th:field="*{typeOfThreat}" /> </th>\n' +
        '                <th><input type="text" th:field="*{person}" /> </th>\n' +
        '                <th><input type="text" th:field="*{initialRisk}" /> </th>\n' +
        '                <th><input type="text" th:field="*{countermeasure}" /> </th>\n' +
        '                <th><input type="text" th:field="*{finalRisk}" /> </th>';
}

チュンドクの操作を行います。

Thymeleaf上でコンパイルされてserverいる間は、Jqueryで処理されますclient。すべてのユーザーが受信するclient側は、HTMLが含まれていないことであるThymeleafことに。あなたは使用することはできませんJQueryとの行を追加するThymeleafことで、コード。

ここでの解決策を使用することですAjaxへの呼び出しをserver新しい行のデータを取得します。