在 PHP 和 MYSQLi 中以树结构显示类别和子类别
Displaying Category and Subcategory in Tree Structure in PHP and MYSQLi
我试图在树结构中显示类别和子类别,就好像我单击类别然后我可以获得与该类别关联的多个子类别。
我知道这个问题被问过多次,但我发现之前问的所有问题的答案都不清楚。
我创建了一个 table AS :
category : cat_id , catName
subcategory : id , cat_id , subCatName
我想显示所有类别,当用户单击类别时,应该会列出子类别。
请帮我找到这个查询。提前致谢。
<?php
$db = new mysqli('localhost','user','password','dbname');
$query = "SELECT id,cat FROM category";
$result = $db->query($query);
while($row = $result->fetch_assoc()){
$categories[] = array("id" => $row['cat_id'], "val" => $row['cat']);
}
$query = "SELECT id, cat_id, subcat FROM subcategory";
$result = $db->query($query);
while($row = $result->fetch_assoc()){
$subcategories[$row['cat_id']][] = array("id" => $row['id'], "val" => $row['subcat']);
}
$jsonCats = json_encode($categories);
$jsonSubCats = json_encode($subcategories);
?>
<!docytpe html>
<html>
<head>
<script type='text/javascript'>
<?php
echo "var categories = $jsonCats; \n";
echo "var subcategories = $jsonSubCats; \n";
?>
function loadCategories(){
var select = document.getElementById("categoriesSelect");
select.onchange = updateSubCats;
for(var i = 0; i < categories.length; i++){
select.options[i] = new Option(categories[i].val,categories[i].id);
}
}
function updateSubCats(){
var catSelect = this;
var catid = this.value;
var subcatSelect = document.getElementById("subcatsSelect");
subcatSelect.options.length = 0; //delete all options if any present
for(var i = 0; i < subcats[catid].length; i++){
subcatSelect.options[i] = new Option(subcats[catid][i].val,subcategories[catid][i].id);
}
}
</script>
</head>
<body onload='loadCategories()'>
<select id='categoriesSelect'>
</select>
<select id='subcatsSelect'>
</select>
</body>
</html>
这是您要找的吗?
不采用树结构,但您可以轻松更改下拉菜单。
我试图在树结构中显示类别和子类别,就好像我单击类别然后我可以获得与该类别关联的多个子类别。
我知道这个问题被问过多次,但我发现之前问的所有问题的答案都不清楚。
我创建了一个 table AS :
category : cat_id , catName
subcategory : id , cat_id , subCatName
我想显示所有类别,当用户单击类别时,应该会列出子类别。
请帮我找到这个查询。提前致谢。
<?php
$db = new mysqli('localhost','user','password','dbname');
$query = "SELECT id,cat FROM category";
$result = $db->query($query);
while($row = $result->fetch_assoc()){
$categories[] = array("id" => $row['cat_id'], "val" => $row['cat']);
}
$query = "SELECT id, cat_id, subcat FROM subcategory";
$result = $db->query($query);
while($row = $result->fetch_assoc()){
$subcategories[$row['cat_id']][] = array("id" => $row['id'], "val" => $row['subcat']);
}
$jsonCats = json_encode($categories);
$jsonSubCats = json_encode($subcategories);
?>
<!docytpe html>
<html>
<head>
<script type='text/javascript'>
<?php
echo "var categories = $jsonCats; \n";
echo "var subcategories = $jsonSubCats; \n";
?>
function loadCategories(){
var select = document.getElementById("categoriesSelect");
select.onchange = updateSubCats;
for(var i = 0; i < categories.length; i++){
select.options[i] = new Option(categories[i].val,categories[i].id);
}
}
function updateSubCats(){
var catSelect = this;
var catid = this.value;
var subcatSelect = document.getElementById("subcatsSelect");
subcatSelect.options.length = 0; //delete all options if any present
for(var i = 0; i < subcats[catid].length; i++){
subcatSelect.options[i] = new Option(subcats[catid][i].val,subcategories[catid][i].id);
}
}
</script>
</head>
<body onload='loadCategories()'>
<select id='categoriesSelect'>
</select>
<select id='subcatsSelect'>
</select>
</body>
</html>
这是您要找的吗? 不采用树结构,但您可以轻松更改下拉菜单。