我有一个页面,其中我使用php来部署上一个查询的结果。它在第一列中显示ID。我想要一些可单击的列来编辑值,在数据库中更改它并刷新页面。为此,当您单击链接列(带有的列)时,它将显示一个Bootstrap模式。当您填充模式时,它将信息发送到JQuery脚本,该脚本通过AJAX调用php页面。可以异步调用该php页面以编辑数据库中的值,并且它需要新值和行ID才能执行UPDATE SQL语句。
我需要将您单击的行的ID发送到使用AJAX的JQuery方法。但是当我调用函数时,我不知道如何将ID作为参数发送。
我试图通过触摸DOM通过JQuery向行中添加ID来找到您单击的行的ID,但这对于我的水平来说太复杂了。
这是php随信息一起部署表的地方。
$resISDEFE = mysqli_query($conexion,"SELECT * FROM personal_isdefe WHERE proyecto=".$idProyecto);
if($resISDEFE->num_rows>0){
$index=0;
while($isdefe = mysqli_fetch_assoc($resISDEFE)){
$resCategoria = mysqli_query($conexion,"SELECT * FROM categoria_isdefe WHERE id=".$isdefe['categoria']);
$categoria = $resCategoria->fetch_row();
$idISDEFE = $isdefe['id']; <-- I save the row's ID here -->
echo "<tr id='isdefe'>";
echo "<td><p>".$idISDEFE."</p></td>";
echo "<td><p>".$categoria[1]."</p></td>";
echo "<td><p>".$isdefe['edg']."</p></td>";
echo "<td><p><a data-toggle='modal' data-target='#modalConcepto'>".$isdefe['porcentaje']."%</a></p></td>";
echo "<td><p>".$isdefe['horas_contratadas']."</p></td>";
$importe_prestacion = $isdefe['horas_contratadas'] * $categoria[2];
echo "<td><p>".number_format($importe_prestacion,2,",",".")." €</p></td>";
echo "<td><p>".number_format(($isdefe['importe_variable']+$importe_prestacion),2,",",".")." €</p></td>";
echo "</tr>";
}
这是它出现的模态。
<div class="modal fade" id="modalConcepto" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Editar concepto</h4>
</div>
<div class="modal-body">
<div class="form-group">
<textarea class="form-control" rows="10" id="newConcepto"></textarea><br>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal" onclick='editConcepto(<?php $idISDEFE ?>)'>Guardar</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
</div>
</div>
</div>
这是单击“ Guardar”时调用的JQuery方法。
function newConcepto(id, newConcepto){
if(newConcepto!=""){
$.get("ajax/editarConceptoISDEFE.php?id="+id+"&con="+newConcepto, function(data){
if(data=="1"){
var time = setTimeout(function(){
location.reload();
},500);
}
else alert("Error al actualizar el concepto");
});
}
}
function editConcepto(id){
var newConcepto = $('#newConcepto').val();
newConcepto(id,newConcepto);
}
}
预期结果是重新加载页面时,您可以在之前单击的行中看到更改后的值。
答案 0 :(得分:1)
这个问题有很多事情要做,但是我要试一试,如果这不是您想要的,您可以引导我朝另一个方向前进。
将要获取的单元格包装在某种类型的标识符span或div中(在我的示例中为.span-of-other-cell
)。使用jQuery .closest
函数获取“行”,然后使用.find
查找标识符及其值:
$(document).on('click', '.some-cell', function () {
var id = $(this).closest('.table-row').find('.span-of-other-cell').val();
});
一些有用的链接:
.closest
:https://api.jquery.com/closest/
.find
:https://api.jquery.com/find/
我将html的data-
前缀用于元素属性。
<div data-id="12345"></div>
如果将data-
属性添加到行中,则上面的javascript会被简化,并且ID在视觉上是隐藏的(尽管对于具有基本浏览器技能的人来说都易于访问,因此这并不意味着难以理解或确保安全性如果需要):
$(document).on('click', '.some-cell', function () {
var id = $(this).closest('.table-row').attr('data-id');
});
让我知道这是否有帮助,或者我是否误解了,需要在回答时选择另一个方向。
这实际上取决于您的目标。如果ID不需要安全(听起来好像是显示在表中,那么就不需要安全),那么您可以使用GET协议将其通过AJAX传递回PHP:
// assume that var "id" is accessible from this ajax function
$.ajax({
url: "script.php?id=" + id
});