новый добавленный ряд не может быть отредактирован

Question

Я использую codeigniter и bootstrap-editable.js и т. Д. Как плагин. Я создал редактируемую таблицу с пустыми значениями. Я только что показал одну строку и сделал кнопку addrow, если пользователь хочет добавить новую строку. Кнопка addnew имеет событие mouseclick, оно автоматически добавит пустую новую строку. Я хочу, чтобы новый добавлен ряд редактируемой также .. Но, как и в моем случае/код, он не работает ..

Вот мой код:

<table class="table " id="memberTB"> 
    <thead><tr><th >First Name</th><th >Middle Name</th><th>Last Name</th></tr></thead> 
    <tbody> 
        <tr><td><span class="edit"></span></td> 
        <td><span class="edit"></span></td> 
        <td><span class="edit"></span></td></tr> 
    </tbody> 
    <button type="button" class="btn btn-link" id="addrow"><span class="fa fa-plus"> Add new row</span></button> 

</table> 

Вот Javascript код:

$.fn.editable.defaults.mode = 'inline'; 
$.fn.editable.defaults.showbuttons = false; 
$.fn.editable.defaults.url = '/post'; 
$.fn.editable.defaults.type = 'text'; 

// make all items having class 'edit' editable 
$('.edit').editable(); 


//ajax emulation 
$.mockjax({ 
url: '/post', 
responseTime: 200, 
response: function(settings) { 
    console.log('done!'); 
    } 
}); 

// this is to automatically make the next item in the table editable 
$('.edit').on('save', function(e, params){ 
var that = this; 
// persist the old value in the element to be restored when clicking reset 
var oldItemValue = $(that)[0].innerHTML; 
if (!$(that).attr('oldValue')) { 
    console.log('persisting original value: ' + oldItemValue) 
    $(that).attr('oldValue', oldItemValue); 
} 
setTimeout(function() { 
    // first search the row 
    var item = $(that).closest('td').next().find('.edit'); 
    console.log(item); 
    if (item.length == 0) { 
     // check the next row 
     item = $(that).closest('tr').next().find('.edit'); 
    } 
    item.editable('show'); 
    }, 200); 
}); 
$('#addrow').click(function() { 
$('#memberTB > tbody:last').append(' <tr><td><span class="edit"></span></td><td><span class="edit"></span></td><td><span class="edit"></span></td></tr>'); 
}); 

Как сделать новую добавленную строку доступной для редактирования? Пожалуйста, помогите мне ..

Answer 1

В вашем $('#addrow').click(function() {});, я хотел бы добавить следующее:

$('.edit').off(); 
$('.edit').fn1(); 
$('.edit').fn2(); 

С fn1 и fn2 быть любые функции, которые связаны с edit класса уже (т.е. .editable и .он)

Это возвращает функцию к выбранным элементам, но сначала удаляет привязку, поэтому элементы не получают двойных (или тройных и т. Д.) Привязок.