Ajax调用动态加载的行

Question

我已经动态加载了(基于搜索结果(内容。(请参阅以下内容(
(stackoverflow不允许我嵌入图像，因为我还是新手(https://i.stack.imgur.com/n7KoE.png

上述代码；

echo '
<td><a href="profile/?student='.$row['sid'].'">'.$row['use_name'].'</a></td>
<td>'.$row['admission_number'].'</td>
<td>'.$row['dob'].'</td><td>Not Assigned</td>
<td>
<form>
<input type="hidden" name="sid" class="sid" value="'.$row['sid'].'">
<input type="hidden" name="classID" class="classID" value="1">
<button class="btn btn-warning btn-sm add" type="button" name="add"><i class="fas fa-pencil-alt"></i> Add</button>
</form>
</td>
<td>
<div id="res"></div>
</td></tr>';
}

我想将sid、classID传递到一个名为add-student.php的单独php文件

$(".add").click(function() { 
$.ajax({
type: "POST",
url: "add-student.php",
data:'sid='+$(".sid").val()+'&cid='+$(".classID").val(),
success: function(data) {
alert(data); 
}
});
return false; 
});
</script>

以下是add-student.php

<?php
require('../../dbc/dbconn.php');
$student = $_POST['sid'];
$class = $_POST['cid'];
$user = "System";

//check the existance
$check = mysqli_query($condb, "select sid, cid from studentsclasses where sid = '$student' and cid = '$class'");
if(mysqli_num_rows($check)>0){
echo 'The record already exists';
}
else{
$insert = mysqli_query($condb, "insert into studentsclasses (sid, cid, createdBy) value('$student', '$class', '$user')");
if($insert){
echo 'Success';
}
else{
echo 'Error';
}   
}
?>

当我第一次点击"添加"按钮时，它成功地添加到了数据库中
但当我在另一行单击"添加"按钮时，我会得到记录已存在错误
请提出建议。

Answer 1

添加所需数据以直接通过data-attributes传递给$(".sid").val()的元素，只会根据您提供的html获得第一个元素的值。

当第一个值始终是正在传递的值时，您对后端的检查将通知您该记录已经存在。

您可以将标记更改为：

<button class="add" type="button" name="add" data-sid="'.$row['sid'].'" data-cid="1">Add</button>

然后监听click事件并发送ajax

$(function(){
$('.add').on('click', function(){
const sidval = $(this).data('sid')
const cidval = $(this).data('cid')
$.ajax({
type: "POST",
url: "add-student.php",
data: {
sid: sidval,
cid: cidval
},
success: function(data) {
alert(data); 
}
});
})
})

https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes