Met*_*bie 15 php jquery mongodb
我在我的html表中填充了名为"modules"的MongoDB集合中的文档.我的文档看起来像:
{
"_id" : ObjectId("59859f9bd5234d8d415eb0ca"),
"name" : "Module A",
"weight" : 18,
"components" : [ "cid1", "cid2","cid3", "cid4","cid5"],
"color" : "blue"
}
我的HTML行结构:
<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);
来自"组件"集合的文档:
{
"_id" : ObjectId("5985ca81d5234d8d415eb421"),
"name" : "Component 2",
"weight" : 1,
"price" : 10,
"color" : "blue"
}
以下我不知道该怎么做:
点击其中一个组件,例如"组件2".在另一个名为"components"的集合中搜索此条目(包含组件名称或ID),并在此窗口或弹出窗口中显示有关此组件的信息.
如何用php/jquery/mongodb实现这一点？
PS:如果需要,您还可以更改/改进我的json结构.
更新:
这是我的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.
这是许多可能的方法之一：
在链接中传递组件 ID，目标是新窗口，该窗口调用不同的 PHP 脚本，从集合中检索文档components并显示数据。
例如，component.php具有以下内容的文件：
<!DOCTYPE html>
<html lang="en">
/* ... */
<?php
$manager = new MongoDB\Driver\Manager("mongodb://localhost:27017");
$filter = [
'_id' => (string) $_GET['id']
];
$options = [];
$query = new MongoDB\Driver\Query($filter, $options);
$cursor = $manager->executeQuery('workshop.components', $query);
$document = reset($cursor); // select first result
?>
/* DISPLAY COMPONENT DETAILS HERE */
在 中app.php，将href组件链接更改为：
echo "<a class='component' href='component.php?id=$component'>".$component."</a>";