"modules"という名前のMongoDBコレクションからHTMLテーブルを作成しました。私は(チュートリアルで見つかった)使用私の接続のためにテーブルエントリをクリックして別のmongodbコレクション(php/jquery)で検索する方法
<tr>
<th scope="row">1
</th><td>Module A</td>
<td>18kg</td>
<td>
<a href="cid1">Component 1</a>
<a href="cid2">Component 2</a>
<a href="cid3">Component 3</a>
<a href="cid4">Component 4</a>
<a href="cid5">Component 5</a>
</td>
<td>blue</td>
</tr>
:
$manager = new MongoDB\Driver\Manager("mongodb://localhost:27017");
$filter = [];
$options = [
'sort' => ['_id' => 1],
];
$query = new MongoDB\Driver\Query($filter, $options);
$cursor = $manager->executeQuery('workshop.modules', $query);
ドキュメントマイHTML-行構造
{
"_id" : ObjectId("59859f9bd5234d8d415eb0ca"),
"name" : "Module A",
"weight" : 18,
"components" : [ "cid1", "cid2","cid3", "cid4","cid5"],
"color" : "blue"
}
:マイドキュメントは次のようになります「コンポーネント」コレクションから:
{
"_id" : ObjectId("5985ca81d5234d8d415eb421"),
"name" : "Component 2",
"weight" : 1,
"price" : 10,
"color" : "blue"
}
私が行う方法を知りません以下:
Klickこれらのコンポーネントのうちの1つに、たとえば「コンポーネント2」。このエントリ(コンポーネント名またはID)の「components」という名前の別のコレクションを検索し、このコンポーネントに関する情報を新しいウィンドウまたはポップアップで表示します。
これはPHP/jquery/mongodbでどのように実現できますか?
PS:必要に応じてJSON構造を変更/改善することもできます。
UPDATE:私のapp.phpソースコードイストここ
:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<!-- Custom CSS for Table -->
<link rel="stylesheet" type="text/css" href="app.css">
</head>
<body>
<?php
$manager = new MongoDB\Driver\Manager("mongodb://localhost:27017");
$filter = [];
$options = [
'sort' => ['_id' => 1],
];
$query = new MongoDB\Driver\Query($filter, $options);
$cursor = $manager->executeQuery('workshop.modules', $query);
?>
<div class="form-group pull-right">
<input type="text" class="search form-control" placeholder="What you looking for?">
</div>
<span class="counter pull-right"></span>
<table class='table table-striped results'>
<thead class="thead-inverse">
<tr>
<th>#</th>
<th>Name</th>
<th>Weight</th>
<th>Components</th>
<th>Color</th>
</tr>
<tr class="warning no-result">
<td colspan="4"><i class="fa fa-warning"></i> No result</td>
</tr>
</thead>
<?php
$i=1;
foreach ($cursor as $document) {
?>
<tr>
<th scope="row"><?php echo $i; ?></td>
<td><?php echo $document->name; ?></td>
<td><?php echo $document->weight; ?>kg</td>
<td>
<?php
$components = $document->components;
foreach($components as $component) {
echo "<a class='component' href=$component>".$component."</a> ";
}
?>
</td>
<td><?php echo $document->color; ?></td>
</tr>
<?php $i++;
}
?>
</table>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<!-- Search function for table -->
<script type="text/javascript" src="tablesearch.js"></script>
</body>
</html>
私は私のapp.phpで動作する実用的なソリューションを必要としています。もちろん、必要に応じてapp.phpを調整することもできます。ここで