gpt4 book ai didi

javascript - 无法从嵌套的 json 生成下拉列表并对其进行过滤

转载 作者:行者123 更新时间:2023-11-30 16:27:48 25 4
gpt4 key购买 nike

我正在尝试按照以下代码从 json 中填充下拉列表并过滤它们。我可以实现直接字段,但无法为嵌套字段加载下拉列表。一旦填充了两个下拉列表,我想过滤它们以查看每个组合的 pid 列表。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> </script>
</head>
<body>
Location: <select id="Location" name="Location"></select>
Category: <select id="Category" name="Category"></select>

<button onclick="javascript:getcount()">Search</button>
<div id="result" style="color:#0094ff;font-size:20px;margin-top:100px;">
Number of Users found : <div id="res"></div>
</div>
<div id="detailedresult" style="color:#0094ff;font-size:20px;margin-top:100px;">
PID's : <div id="pidRes"></div>
</div>

<script type="text/javascript">
var jsonList = {
"Users": [{ "pid": "2", "loc": "Bangalore", "cat": [{ "dname": "Hotels" }, { "dname":"Travel" }, { "dname":"Banking" }] },
{ "pid": "3", "loc": "Chennai", "cat": [{ "dname":"Hotels" }, { "dname":"Travel" }, { "dname":"Banking" }] },
{ "pid": "4", "loc": "Delhi", "cat": [{ "dname":"Hotels" }, { "dname":"Travel" }, { "dname":"Healthcare" }] },
{ "pid": "5", "loc": "Hyderabad", "cat": [{ "dname":"Retail" }, { "dname":"Insurance" }, { "dname":"Banking" }] },
{ "pid": "6", "loc": "Hyderabad", "cat": [{ "dname":"Ecommerce"},{"dname":"Banking"},{"dname":"Healthcare"},{"dname":"Travel"},] }]
}

$(document).ready(function () {
var count = Object.keys(jsonList.Users).length
$('#res').html(count);

var listItems= "";
for (var i = 0; i < jsonList.Users.length; i++){
listItems+= "<option value='" + jsonList.Users[i].pid + "'>" + jsonList.Users[i].loc + "</option>";
}
$("#Location").html(listItems);

var listItems3 = "";
for (var i = 0; i < jsonList.Users['cat']['dname'].length; i++) {
listItems2 += "<option value='" + jsonList.Users[i].pid + "'>" + jsonList.Users[i].cat.dname + "</option>";
}
$("#Category").html(listItems3);
}
);

function getcount()
{
var loc = document.getElementById('Location').value;
var cat = document.getElementById('Category').value;
var count = Object.keys(jsonList.Users).length // Where condition required.. when Location and Category are available.. For each combination (Location + Category), how many users and what are the pid's
$('#res').html(count);
}
</script>

我在上面的类别下拉生成代码中遗漏了什么?

如何根据位置和类别值(每个组合的相应 pid 列表)过滤 json?

编辑:

要求:

首先:来自位置“类加罗尔”且类别为“银行”的 pid 列表(结果 pid = 2)

第二:来自钦奈或具有类别电子商务类别的 pid 列表(结果 pid => 3,6)

最佳答案

不确定您想要什么,但这里有一组有效的下拉列表,它们根据提供的 json 进行填充。您可能一直在寻找这个循环来填充类别

 for (var i = 0; i < jsonList.Users.length; i++){
listItems+= "<option value='" + jsonList.Users[i].pid + "' data-ind='"+i+"'>" + jsonList.Users[i].loc + "</option>";
pidres+= "Location: " +jsonList.Users[i].loc+ ". PID: " +jsonList.Users[i].pid+ ". Number of categories: " +jsonList.Users[i].cat.length + "<br />"

//loop all cats
for (var j = 0; j < jsonList.Users[i].cat.length; j++) {

listItems3 += "<option value='" + jsonList.Users[i].cat[j].dname + "'>" + jsonList.Users[i].cat[j].dname + "</option>";


}
}

//then to filter the results
$("#Category > option").each(function () {
if(usedNames[this.text]) {
$(this).remove();
} else {
usedNames[this.text] = this.value;
}

});

这是一个demo

关于javascript - 无法从嵌套的 json 生成下拉列表并对其进行过滤,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33837300/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com