動的に作成された行のjqueryを使用して編集する方法

Question

フォームデータを追加してjQueryを使用してテーブルに行を動的に作成しました。ここで、ボタンのクリックで編集する関数を追加したいとします。
ユーザーが編集ボタンをクリックすると、テーブルから行が削除され、フォームの関連するフィールドに値が再度割り当てられます。

コード：

<form id="form1" > 
     <input type="text" id="input1" /> 
     <input type="text" id="input2" /> 
     <input type="text" id="input3" /> 
     <input type="text" id="input4" /> 
     <input type="submit" id="submit-btn" value="submit" /> 
</form> 

Answer 1

ただ、次のコードを試してみてください... `edit`コードがある場合は... Tdの属性のそれぞれであなたのアペンド機能に

$(document).ready(function(){ 

$('#mytable').on('click','.editrow',function(){ 

    var item1 = $(this).closest('tr').find('.td1').text(); 
    var item2 = $(this).closest('tr').find('.td2').text(); 
    var item3 = $(this).closest('tr').find('.td3').text(); 
    var item4 = $(this).closest('tr').find('.td4').text(); 
    $('#input1').val(item); 
    $('#input2').val(item2); 
    $('#input3').val(item3); 
    $('#input4').val(item4); 
    $(this).closest('tr').remove(); 
}); });