刚开始，这听起来像是一个愚蠢的问题，但我如何使用更新按钮来更新单个行，而不仅仅是顶部行。每当我使用更新按钮时，只有当它是最上面的一行时，请求才会通过。
这是index.php 的代码
<html>
<head>
<title>Test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<center>
<h3>UPDATE DATA</h3>
<?php
$run = 0;
$conn = new mysqli('localhost', '', '', '');
$sql = "SELECT * FROM moderator";
$result = $conn->query($sql);
while ( $row=mysqli_fetch_assoc($result)) {
$run = $run + 1;
?>
<div>
ID<input type="text" id="id" value="<?php echo $row['id']; ?>">;
Moderator<input type="text" id="mod" value="<?php echo $row['name']; ?>">;
Category<input type="text" id="ctgr" value="<?php echo $row['category']; ?>">;
<button type="submit" id="update" rel="<?php echo $run; ?>">UPDATE</button>
</div>
<?php
}?>
</center>
<script>
$(document).ready(function(){
$("#update").click(function(){
var name=$("#mod").val();
var ctgr=$("#ctgr").val();
var id=$("#id").val();
$.ajax({
url:'update.php',
method:'POST',
data:{
name:name,
ctgr:ctgr,
id:id
},
success:function(response){
alert(response);
}
});
});
});
</script>
</body>
这是更新的代码。php
<?php
$conn = new mysqli('localhost', '', '', '');
$name=$_POST["name"];
$ctgr=$_POST["ctgr"];
$id=$_POST["id"];
$sql="UPDATE moderator set name='$name', category='$ctgr' where id='$id'";
if($conn->query($sql)===TRUE){
echo "DATA updated";
}
?>
你可能会看到我试图为每一行创建一个单独的变量，但我无法理解。抱歉，代码也很乱。
我删除了数据库信息，但插入凭据时会显示行。
这是因为你有重复的输入ID，你应该在html上只有一个具有相同值的ID，这在某种程度上是有效的，你不会得到错误，但当你试图访问这些ID时，你会在javascript中遇到麻烦，你只会得到第一个。
要修复此问题，您可以删除id并将其作为类：
<div>
ID<input type="text" class="id" value="<?php echo $row['id']; ?>">;
Moderator<input type="text" class="mod" value="<?php echo $row['name']; ?>">;
Category<input type="text" class="ctgr" value="<?php echo $row['category']; ?>">;
<button type="submit" class="update" rel="<?php echo $run; ?>">UPDATE</button>
</div>
并使用此JS:
$(document).ready(function(){
$(".update").click(function(){
var container = $(this).closest('div'); // parent div
var name = container.find('.mod').val();
var ctgr = container.find('.ctgr').val();
var id = container.find('.id').val();
$.ajax({
url:'update.php',
method:'POST',
data:{
name:name,
ctgr:ctgr,
id:id
},
success:function(response){
alert(response);
}
});
});
});
所有行输入元素都具有相同的id属性
第一行的类似id元素是类似id、mod、ctgr
第二行元素的id也是id，mod ctgr
Jquery查找第一个元素，如果存在相同id的多个元素
您可以通过应用程序挂起一个uniqe增量变量$run作为来创建唯一id
ID<input type="text" id="id"+<?php echo $run; ?> value="<?php echo $row['id']; ?>">; Moderator<input type="text" id="mod"+<?php echo $run; ?> value="<?php echo $row['name']; ?>">; Category<input type="text" id="ctgr"+<?php echo $run; ?> value="<?php echo $row['category']; ?>">; <button type="submit" id="update" rel="<?php echo $run; ?>" onclick="updatetodb( <?php echo $run; ?>);“ >UPDATE</button>
然后创建一个带有一个参数的名为updatetodb的javascript函数，并通过该参数将行标识为
function updatetodb(var run) {
var id=$('#id' +run).value;