javascript - 編集ウィンドウで表の行を編集する方法

Question

私は問題があります。テーブルで選択した行を編集することです。テーブルの各行には、最後に自分自身を編集するためのボタンがあります。このボタンをクリックすると、テーブルから選択したデータ行を編集するための編集ウィンドウが表示されます。Bootstrap を使用していますが、問題があります。編集ウィンドウを取得し、編集ウィンドウで保存をクリックして選択した行を新しい値に置き換える方法は??
私の例を見るのが一番です！

これは私の **デモです

新しい行を追加するボタン

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  + Define a new visual feature
</button>

新しい行を追加するテーブル。

    <table class="table table-striped" id="table-visual-features">
        <thead>
            <tr>
                <th>Visual Feature</th>
                <th>Type [currently not used]</th>
                <th>Description</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

これは、テーブル内の選択された行にある値です。Bootstrapを使用して編集ウィンドウを使用して編集したいこの値

    console.log($(this).closest('tr').children('td').eq(0).text());
    console.log($(this).closest('tr').children('td').eq(1).text());
    console.log($(this).closest('tr').children('td').eq(2).text())