我有一个使用PHP从mysql数据库获取用户数据的系统。 “ while”语句显示数据库表中的结果。我希望能够为数据库中的每个用户添加一项技能。我有一个按钮,单击该按钮时会触发一个带有用户名和ID的模式弹出窗口。我无法获得迭代按钮来触发模式弹出窗口。仅第一行中的按钮起作用。(请原谅我的英语)。我如何获得所有按钮来触发将显示相应用户名和ID的模式弹出窗口?
HTML和PHP
<Label class="fas" text=""></Label>
JavaScript
char operatorValue;
do
{
printf("\nEnter Operator:");
scanf("%c", &operatorValue);
} while (strcmp(operatorValue, '+') != 0 || strcmp(operatorValue, '-') != 0 ||
strcmp(operatorValue, '*') != 0 || strcmp(operatorValue, '/') != 0);
CSS
<table id="proj" border="0" width = "85%">
<tr >
<td width = "30%" align = "center">User ID</td>
<td width = "30%" align = "center">Name</td>
<td align = "center">Actions</td>
</tr>
</table>
<!--rows containing stuff from database-->
<?php
include 'dbcon.php';
$sql = "SELECT * FROM users";
$result = $con->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
?>
<div class="prows">
<div class="prow" align = "center">
<div class="id1">
<?php echo $row["id"]; ?>
</div>
<div class="status1">
<?php echo $row["name"]; ?>
</div>
<div class="pm1">
<button id="bnUpdt">Add Skill</button>
</div>
</div>
</div>
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<div class="modal-header">
<span class="close">×</span>
<h2 style="display:inline-block; margin-right:100px;">Name: <?php echo $row["name"]; ?></h2>
<p style="display:inline-block;margin-right:100px;">User ID: <?php echo $row["id"]; ?></p>
</div>
<form action="update.php" method="post" class="modal-body" align="center">
<div class="task" >
<input type="text" name="task" >
<button type="submit" name="button"> Add</button>
</div>
</form>
</div>
</div>
<?php
}
}
?>
我想让每一行中的每个按钮触发模式弹出窗口
答案 0 :(得分:1)
如ryantxr所述,您不能有多个具有相同名称的ID。添加一个类名,然后遍历它们。大概是这样吗?假设您已将class =“ bnUpdate”添加到必要的元素。
var elem = document.getElementsByClassName('bnUpdt');
for(var i=0; i<elem.length; i++) {
elem[i].addEventListener("click", function() {
// add skill code...
});
}
希望有帮助。