使用AJAX或Javascript将值从一个DIV解析为另一个DIV

Question

我有一个用PHP以表格形式显示的值列表，公司名称&公司类型。单击任何"公司名称"列表时，它会获取该列表的ID，并转到另一个页面，使用ID查询数据库表以显示另一个列表。但我需要帮助如何在同一个页面上显示这一信息，而不是将用户带到另一个页面，它应该向下切换并解析单击到下一个DIV的公司名称的ID，并在那里重用该ID。以下是我的代码：

--------------------- First Div --------------------------
<div class="panel col-100">
<div class="panelHeader">
<h1>Listed Companies</h1>
</div>
<div class="panelBody">
<div class="table">
<div class="tableHeader">
<div class="tr">
<div class="th">NO.</div>
<div class="th">COMPANY NAME</div>
<div class="th">COMPANY TYPE</div>
</div>
</div>
<div class="tableBody">


<?php
$query_active = "SELECT * FROM  `table`";
$result_active = mysqli_query($connLocal, $query_active);
if(mysqli_num_rows($result_active)){
$active_numbering=0;
while($row_active = mysqli_fetch_assoc($result_active)){
$active_numbering++;
$project_id     = $row_active['project_id'];
$project_name  = $row_active['project_name'];
$project_type = $row_active['project_type'];
?>



<div class="tr">
<div class="td"><?=$active_numbering;?></div>
<div class="td" data-toggle="collapse" data-target="#process_toggle" ><a href="activities_page.php?process_id=<?=$process_id; ?>" ><?=$project_name; ?></a></div>
<div class="td"><?=$project_type; ?></div>

</div>
<?php
}
}
?>

</div>
</div>
</div>
</div>
--------- First DIV ends --------------

-------------- Second DIV Starts ---------------
<div id="process_toggle" class="collapse">

<div class="panel col-100">
<div class="panelHeader">
<h1>Process</h1>
<button type = "button" class = "add-new" onclick = "openAddTab('','0')">Add new</button>
</div>
<div class="panelBody">
<div class="table">
<div class="tableHeader">
<div class="tr">
<div class="th">NO.</div>
<div class="th">PROCESS NAME</div>
<div class="th"></div>
</div>
</div>
<div class="tableBody">
<?php
$query_process = " SELECT * FROM  `table` WHERE project_id = '".$project_id."' " ;
$result_process = mysqli_query($connLocal, $query_process);
if(mysqli_num_rows($result_process)){
$NO=0;
while($row_process = mysqli_fetch_assoc($result_process)){
$NO++;
$name     = $row_process['process_name'];
$process_id     = $row_process['process_id'];


?>
<div class="tr">
<div class="td"><?=$NO; ?></div>
<div class="td"><a href="activities_page.php?process_id=<?=$process_id; ?>"><?=$name?></a></div>
<form method="POST">
<input type="hidden" name="process_id" value="<?=$process_id; ?>">
<input type="hidden" name="id_project" value="<?=$project_id; ?>">
<div class="col-50-form">
<button type="submit" name="submit_del_process" style="background-color: red; color: white; padding-right: 50px;padding-left: 10px; padding-top: 10px;padding-bottom: 10px; font-size: 10px"><center>DELETE</center></button>
</div>

</form>
</div>
<?php
}
}
?>
</div>
</div>
</div>
</div>




</div>

------------------- Second DIV ends ---------------------

```

The ID to be parse from onclick of company name is "$project_id" from first DIV to the second DIV so I can reuse the ID.

Answer 1

有些人我能够解决这个问题，但只需使用AJAX将URL从第一个div.获取到第二个div

-------------------- AJAX ----------------------
<script type="text/javascript">

$("#project_id_parse").click(function(e) {
e.preventDefault(); // <-------stop the def behavior here.
var id = this.href.split('=').pop(); // extract the id here
$.ajax({
type: "get",
url: "project_list.php",
data: {id:id}, // now pass it here
success: function(data) {
$('#process_toggle').html(data); //copy and paste for your special case
}
});
});

--------------------- First DIV -------------------------
<?php
$query_active = "SELECT * FROM  `table`";
$result_active = mysqli_query($connLocal, $query_active);
if(mysqli_num_rows($result_active)){
$active_numbering=0;
while($row_active = mysqli_fetch_assoc($result_active)){
$active_numbering++;
$project_id     = $row_active['project_id'];
$project_name  = $row_active['project_name'];
$project_type = $row_active['project_type'];
?>
<div class="td" id="project_id_parse">
<a href="project_list.php?id=<?=$project_id; ?>" >
Project Name
</a>
</div>


--------------------- Second DIV -------------------------

<div id="process_toggle" >

<?php
$project_id = $_GET["id"];
echo $project_id;
?>