Я новичок в JQuery и пытаюсь определить функцию JQuery с целью редактирования строки таблицы: модал запрашивает новые значения, а затем функция обновляет содержимое строки таблицы. Но когда я выбираю строку, которую хочу отредактировать, переменная, в которой была сохранена строка, «накапливает» все предыдущие строки, которые были отредактированы в одном и том же объекте, и когда я пытаюсь обновить новые значения в этой отдельной строке, все строки, отредактированные до получения, показывают одинаковое значение. Почему это происходит?
Я покажу вам код:
$("#table").on("click", ".edit", function() {
var table = $("#table").DataTable();
var row = $(this).closest("tr");
//getting the <tr> content with Datatables API:
var values = $table.row(row).data();
$("#name").val(values[0]);
$("#surname").val(values[1]);
$("#city").val(values[2]);
$("#myModal .modal-footer").on("click", "#confirm", function() {
var newValues = []
//getting the <tr> content with Datatables API:
//this alert appears as many time as many rows have been changed
alert($table.row(row).data());
//deleting the old data from the server...
//getting the new values:
newValues.push($("#name").val());
newValues.push($("#surname").val());
newValues.push($("#city").val());
//adding the new date to the server...
$("#myModal").modal("hide");
//update the html table:
table.row(row).data([newValues[0], newValues[1], newValues[2]]);
});
});
Как я объяснял ранее, переменная "row" в .on("click")
Функция «накапливает» все строки, которые были отредактированы ранее.
Я думал, что это проблема объема, поэтому я также попытался вызвать функцию extern, которая в основном делала то же самое и использовала объект event.data:
$("#confirm").on("click", {table: table, row: row}, edit);
но без удачи. Если кто-нибудь сможет мне помочь или даже дать какой-нибудь совет или документацию, это будет очень ценно.