我需要将数据从我的HTML表格传输到我的模态（我没有使用bootstrap）。从下图中可以看出，我将MySQL数据库中的数据显示在表格中。
问题是当我点击第一行的EDIT按钮时，数据将被传输到我的模态。但是，当我单击第二行的EDIT按钮时，传输到我的模态的数据仍然是第一行的数据。请帮我解决这个问题。我还在学习PHP和JavaScript。
Table Data Generation Here | Modal Here
PHP代码：
while ($row = mysqli_fetch_array($result)) {
echo "<tr class='table-row'>
<td class='table-cell'>".$row['program']."</td>
<td class='table-cell'>".$row['project_name']."</td>
<td class='table-cell'>".$row['department']."</td>
<td class='table-cell'>".$row['start_date']."</td>
<td class='table-cell'>".$row['end_date']."</td>
<td class='table-cell'><span style='color:".$color."'><i class='fa fa-circle-o'></i></span> ".$row['priority']."</td>
<td class='table-cell'><span style='color:".$color_2."'><i class='fa fa-circle-o'></i></span> ".$row['status']."</td>
<td class='table-cell'><a id='edit-modal-show' class='btn btn-edit'>Edit</a>
<div class='editProject-modal' id='edit-project-modal'>
<div class='editProject-modal-dialog'>
<div class='editProject-modal-content'>
<div class='editProject-onboard'>
<header class='onboard-header'>
<h1 class='onboard-title'>Edit Project</h1>
<button class='onboard-close-2'>
<i class='fa fa-close'></i>
</button>
</header>
<div class='onboard-body'>
<form autocomplete='off' method='POST'>
<input type='hidden' id='".$row['project_id']."' name='p-id' value=".$row['project_id'].">
<div class='row'>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Program</label>
<input type='text' placeholder='Program' name='program' id='pr-".$row['project_id']."' class='form-control' value='".$row['program']."' required>
</div>
</div>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Project Name</label>
<input type='text' placeholder='Project Name' name='pname' id='pn-".$row['project_id']."' class='form-control' value='".$row['project_name']."' required>
</div>
</div>
</div>
<div class='row'>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Project Description</label>
<textarea type='text' placeholder='Project Description' name='description' id='desc-".$row['project_id']."' class='form-control' required>".$row['description']."</textarea>
</div>
</div>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Lead Department</label>
<select class='form-control' name='department' required>
<option value=''>Department</option>";
if ($count_2> 0) {
while ($row_2 = mysqli_fetch_array($result_2)) {
if ($row_2['department'] == $row['department']){
$selected = "selected";
}
else {
$selected = "";
}
echo "<option value='".$row_2['department']."'".$selected.">".$row_2['department']."</option>";
}
}
echo"</select>
</div>
</div>
</div>
<div class='row'>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Start Date</label>
<input type='date' name='s-date' id='s-date-".$row['project_id']."' class='form-control' value='".$row['start_date']."' required>
</div>
</div>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>End Date</label>
<input type='date' name='e-date' id='e-date-".$row['project_id']."' class='form-control' value='".$row['end_date']."' required>
</div>
</div>
</div>
<div class='row'>
<div class='column-2'>
<div class='form-field'>
<label class='field-label'>Priority</label>
<select class='form-control' name='priority' id='priority' required>
<option value=''>Priority</option>";
if ($count_3 > 0) {
while ($row_3 = mysqli_fetch_array($result_3)) {
if ($row_3['priority'] == $row['priority']){
$selected = "selected";
}
else {
$selected = "";
}
echo "<option value='".$row_3['priority']."'".$selected.">".$row_3['priority']."</option>";
}
}
echo "</select>
</div>
</div>
<div class='column-2'>
<div class='onboard-btn'>
<button type='submit' class='btn btn-update' name='update'>Update</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</td>
<td class='table-cell'><a href='delete.php?del=".$row['project_id']."' class='btn btn-delete'>Delete</i></a></td>
</tr>";
}
使用Javascript：
/* Edit Project Modal Event */
var modal_edit = document.getElementById('edit-project-modal');
var span_edit = document.getElementsByClassName("onboard-close-2")[0];
$(document).on('click',".btn-edit",function(){
$(modal_edit).toggleClass("edit-modal-show");
});
span_edit.onclick = function() {
$(modal_edit).removeClass("edit-modal-show");
}
答案 0 :(得分：0)
因为它不知道哪个编辑按钮与巫婆模态有关。 使用
.." . $PHPVariable . "..
我知道的另一件事与您的请求无关，但在解决此问题时会给您错误的结果。模型中的表单应该具有唯一的名称，例如您的记录ID，以便在提交时，您知道哪个表单已提交。
P.S。 - 如果你在echo（）中使用双引号，那么可以直接写echo "<p id='$PHPVariable'>"双引号来解析PHP变量，而不是使用public void funcRollShirts (View view)
{
Random random = new Random();
for (int counter=1;counter<=5;counter++)
{
int number = random.nextInt(6);
pic.setImageResource(array[number]);
}
}
使用双引号，但要注意弄乱单引号和双引号。
答案 1 :(得分：0)
我认为您必须在列表页面中执行此操作，您必须在按钮上调用onClick方法，并将尊重ID作为参数
<td onClick="editRow(<?php echo $value['id']; ?>);"><?php echo ($value['display_offer']); ?></td>
然后在函数中使用ajax根据id获取相应的值并填充模型。
答案 2 :(得分：0)
我认为每个编辑模式的问题都是相同的ID。 ID必须在页面上唯一。
您可以通过两种方式解决问题：
在循环 $ counter 中使用计数器变量，并以这种方式分配...id='edit-project-modal-".$counter."'>等ID，您将获得 edit-project-modal-1 <等唯一ID / em>， edit-project-modal-1 。
制作单个模态并在单击编辑按钮时动态添加内容。通过这种方式，您可以使用具有唯一ID的单个模式，并且页面大小也会更小。要添加内容，您可以充分利用数据属性或jQuery的.closest（）和.find（）方法。
一些建议：
如果您使用带双引号的echo（），请直接使用<p id='$phpvariables'>。双引号可以解析PHP变量。
使用bootstrap的Modal only build，请参阅https://getbootstrap.com/docs/3.3/customize/以避免与模式相关的错误。