Javascript，X-Editable只更新第一个提交的数据，而不更新第二个

我有一个动态填充的模式窗口。单击按钮后，它将为表中的每一行打开。以下是一个例子：

<!-- The Modal -->
<div id="callModal" class="callModal">
     <!-- Modal content -->
    <div class="modalCall-content">
      <div class="modalCall-header">
        <span class="closeModal">&times;</span>
        <h2 id="nameOfCalled">Modal Header</h2>
      </div>
      <div class="modalCall-body">
        <p class="shortNoteOfLeadClass" id="shortNoteOfLead" style="font-size:25px;"></p>
        <p>There will be statuses, notes and last call info...</p>
      </div>
      <div class="modalCall-footer">
        <h3><button type="button" class="btn btn-danger">End Call</button></h3>
      </div>
    </div> 
</div>

&时代；
模态头

将有状态，笔记和最后的通话信息

结束通话

我是这样填写表格的：

// Get the modal
var modal = document.getElementsByClassName('callModal')[0];
// Get the <span> element that closes the modal
var span = document.getElementsByClassName("closeModal")[0];

// When the user clicks on the button, open the modal
function callThisTel(telID) {
    var leadName = document.getElementById("leadName_"+telID).textContent;
    var leadDescript = document.getElementById("leadDescript_"+telID).textContent;
    var assignedTo = document.getElementById("leadAssignedTo_"+telID).getAttribute("data-title");
    var currentProfile = document.getElementsByClassName("staff-profile")[0].getAttribute("alt");
    document.getElementsByClassName("shortNoteOfLeadClass")[0].setAttribute("data-pk", telID);

    document.getElementById("nameOfCalled").textContent = leadName;
    document.getElementsByClassName("shortNoteOfLeadClass")[0].textContent = leadDescript;
    modal.style.display = "block";
    $.fn.editable.defaults.mode = 'inline';
    $('.shortNoteOfLeadClass').editable({
        url: '<?php echo base_url('changeData.php'); ?>',
        pk: telID,
        type: 'text',
        title: 'Change description'
    });
}

//获取模式
var modal=document.getElementsByClassName（'callModal'）[0]；
//获取关闭模态的元素
var span=document.getElementsByClassName（“closeModal”）[0]；
//当用户单击该按钮时，打开模式对话框
函数callThisTel（telID）{
var leadName=document.getElementById（“leadName”+telID）.textContent；
var leadscript=document.getElementById（“leadscript_u3;”+telID）.textContent；
var assignedTo=document.getElementById（“leadAssignedTo”+telID”）.getAttribute（“数据标题”）；
var currentProfile=document.getElementsByClassName（“员工档案”）[0].getAttribute（“alt”）；
document.getElementsByClassName（“shortNoteOfLeadClass”）[0].setAttribute（“数据主键”，telID）；
document.getElementById（“调用的名称”）.textContent=leadName；
document.getElementsByClassName（“shortNoteOfLeadClass”）[0]。textContent=leadDescript；
modal.style.display=“块”；
$.fn.editable.defaults.mode='inline'；
$（'.shortNoteOfLeadClass'）。可编辑({
url:“”，
主键：telID，
键入：“文本”，
标题：“更改说明”
});
}

---

但问题是，每次模态打开时，它都工作得很好。所有数据填写无误。所有文本与表中的文本相同。所有的PK都在模式中更改，当我编辑/保存文本时，效果良好。但在我第二次提交表单后，它只更改了我第一次提交的第一个“pk”。但不是每次打开模式时都会更新的新模式。

更新：现在它可以正常工作，但前提是我：

$('.shortNoteOfLeadClass').editable("destroy");

就在：

document.getElementsByClassName("shortNoteOfLeadClass")[0].setAttribute("data-pk", telID);

---

更新：现在它可以正常工作了，但前提是我：

$('.shortNoteOfLeadClass').editable("destroy");

就在：

document.getElementsByClassName("shortNoteOfLeadClass")[0].setAttribute("data-pk", telID);