数据表获取 ID

Question

我正在使用DataTables和CodeIgniter，现在我希望能够编辑表中的任何行，我已经在这样做了！但我只更新 ID = 1 的行，那是因为我在我的控制器中定义了这个：

$this->db->set('NameContact', $_POST['Name']);
$this->db->set('NumberContact', $_POST['Number']);
$this->db->where('IdContact', 1);
$this->db->update('contacts');

如您所见，我需要获取表中所选行的 id，以便使用 $_POST 方法传递它。但是我似乎找不到通过JS的正确方法。有什么帮助吗？

我的网页：

{Contacts}
<tr>
<td id="{IdContact}">{IdContact}</td>
<td>{NameContact}</td>
<td>{NumberContact}</td>
<td><a data-toggle="modal" data-target="#EditNumber"> <i class="fa fa-edit"></i></a></td>
</tr>
{/Contacts}

我的JS：

function EditPhoneNumber(){
var Name = document.getElementById("EditName").value;
var Number = document.getElementById("EditNumber").value;
console.log(Name);
console.log(Number);
jQuery.ajax({
type: "POST",
url: 'http://localhost/projeto/index.php/Backoffice_Controller/EditContacts',
data: {Name: Name, Number: Number},
success: function (response) {
console.log("success");
console.log(response); 
},
error: function(response){
console.log("error");
console.log(response); 
}
});
}

这是我的模态：

<div id="EditNumber" class="modal fade" role="dialog">

<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Editar Contacto</h4>
</div>
<div class="modal-body">
<input type="text" name="NameContact" placeholder="Name" id="EditName"><br>
<input type="text" name="NumberContact" placeholder="Number" id="EditNumber">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-default" onclick="EditPhoneNumber()">Editar</button>
</div>
</div>

Answer 1

像下面这样将数据 ID 传递到您的 html 标签中，在标签单击时，您需要管理函数而不是直接打开模态。看看下面的代码。

.HTML

{Contacts}
<tr>
<td id="{IdContact}">{IdContact}</td>
<td>{NameContact}</td>
<td>{NumberContact}</td>
<td><a href="javascript:void(0)" data-id="{IdContact}" onclick="editNumberModal(this)"> <i class="fa fa-edit"></i></a></td>
</tr>
{/Contacts}

在你的模态中

<div id="EditNumber" class="modal fade" role="dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Editar Contacto</h4>
</div>
<div class="modal-body">
<input type="text" name="NameContact" placeholder="Name" id="EditName"><br>
<input type="text" name="NumberContact" placeholder="Number" id="EditNumber">
<input type="hidden" name="NumberContactId" id="EditId">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-default" onclick="EditPhoneNumber()">Editar</button>
</div>
</div>
</div>

.JS

function editNumberModal(obj){
vat id = jQuery(obj).attr('data-id');
jQuery('#EditNumber').modal();
}
function EditPhoneNumber(){
var Name = document.getElementById("EditName").value;
var Number = document.getElementById("EditNumber").value;
var Id = document.getElementById("EditId").value;
console.log(Name);
console.log(Number);
jQuery.ajax({
type: "POST",
url: 'http://localhost/projeto/index.php/Backoffice_Controller/EditContacts',
data: {Name: Name, Number: Number, Id:Id},
success: function (response) {
console.log("success");
console.log(response); 
},
error: function(response){
console.log("error");
console.log(response); 
}
});
}