内联编辑和更新

Question

我的以下代码适用于内联edit和update的动态表，其中包含一些controller.Code工作正常，但我在edit和{{1}时发现了一个错误单行的操作工作正常。

如果我点击多行中的编辑按钮，之后我点击任何一行中的更新按钮，所有行都会更新。实际上相关的行只能更新吗？什么是错误？update方法中的任何错误？

这是我的职能：

each()

还有一个疑问function empRoles() { $.ajax({ type: 'POST', url: "/Admin/getRolesList", data:'{}', dataType: 'json', success: function (response) { console.log(response) var roleList = response; $('#content').html(''); for (var i = 0; i < roleList.length; i++) { var table = '<tr id="' + roleList[i].Id + '"><td>' + (i + 1) + '</td><td class="roleName" id="name' + i + '">' + roleList[i].name + '</td><td><button class="btn edit btn-info" id="edit' + i + '"><i class="fa fa-pencil"></i>Edit</button><button class="btn update btn-success" id="update' + i + '"><i class="fa fa-floppy-o"></i>Update</button><button class="btn dlt btn-danger" onclick="deleteRow(this)" data-dismiss="modal" ><i class="fa fa-trash-o"></i>Delete</button></td><tr>'; $('#content').append(table); editUpdate(); } }, failure: function (response) { noData() } }); } function noData() { $('.noData').show(); } function editUpdate() { $('.update').hide(); $('.edit').click(function () {debugger var editId = $(this).attr('id'); $(this).parents('tr').find(':nth-child(2)').not(':button').css("background", "#d9edf7").focus(); $("#" + editId).hide(); var number = editId.replace("edit", ""); $("#update" + number).show(); var currentTD = $(this).parents('tr').find(':nth-child(2)'); $.each(currentTD, function () { $(this).prop('contenteditable', true) }); }); $('.update').click(function () {debugger $(this).parents('tr').find(':nth-child(2)').not(':button').css("background", "none"); var updateId = $(this).attr('id'); $("#" + updateId).hide(); var number = updateId.replace("update", ""); $("#edit" + number).show(); var currentTD = $(this).parents('tr').find(':nth-child(2)'); $.each(currentTD, function () { $(this).prop('contenteditable', false) }); var id = $(this).closest('tr').attr('id'); var name = $(this).parents('tr').find(':nth-child(2)').html(); var Roles = { name: name, role_id: id }; var ajxObj = { oRoles: Roles }; $.ajax({ type: 'POST', url: "/Admin/RoleUpdate", contentType: "application/json; charset=utf-8", data: JSON.stringify(ajxObj), dataType: 'json', success: function (response) { $(".roleCreated").html("Role Updated successfully!"); $('.roleCreated').show(); setTimeout(function () { $('.roleCreated').hide(); }, 1500); empRoles() }, failure: function (response) { alert(response.responseText); } }); }); } 在最后.focus()无法使用。
请大家帮我澄清一下。

Answer 1

这是因为您正在调用＆＃39; empRoles（）＆＃39;来自＆＃39;更新＆＃39;单击。只要您点击“更新”，就会发生ajax调用，然后调用“empRoles”。你的这个方法（empRoles）然后重新创建整个表格，你会看到一个全新的表格。 请仅在需要更新整个表时尝试调用empRoles。