javascript - 如何使用 JQuery 搜索 JSON 字符串

Question

在我使用 Web 服务的应用程序中，该 Web 服务方法返回 JSON 字符串，如下所示，

[
   {
      "No":"21",
      "Area":"Default",
      "Branches":[
         {
            "No":"1108",
            "Area":"Davie",
            "IsValid":"False"
         },
         {
            "No":"1107",
            "Area":"Ab region109",
            "IsValid":"False"
         },
         {
            "No":"1105",
            "Area":"Hollywood",
            "IsValid":"False"
         }
      ]
   },
   {
      "No":"17",
      "Area":"East",
      "Branches":[
         {
            "No":"212",
            "Area":"region109",
            "IsValid":"False"
         },
         {
            "No":"219",
            "Area":"region116",
            "IsValid":"False"
         }
      ]
   },
   {
      "No":"24",
      "Area":"East11",
      "Branches":[
         {
            "No":"211",
            "Area":"region108",
            "IsValid":"False"
         },
         {
            "No":"218",
            "Area":"region109",
            "IsValid":"False"
         },
         {
            "No":"1102",
            "Area":"region999",
            "IsValid":"False"
         }
      ]
   },
   {
      "No":"25",
      "Area":"N25",
      "Branches":[
         {
            "No":"213",
            "Area":"region110",
            "IsValid":"False"
         },
         {
            "No":"220",
            "Area":"region999",
            "IsValid":"False"
         }
      ]
   }
]

我将此 JSON 与 kendo treeview 一起使用。这适用于 PC 设备。但是，随着庞大的 JSON 集(以上 JSON 是庞大集的一部分)kendo treeview 出现了选项卡和移动设备的滞后问题。目前这个JSON，我直接与kendo treeview绑定(bind)。但为了减少滞后问题并提高效率，我需要在过滤后将 JSON 字符串绑定(bind)到 kendo treeview 。那么我不需要绑定(bind)所有这些巨大的 JSON，只绑定(bind)相关的 JSON。我认为要实现这一目标，我需要创建另一个函数来搜索/过滤这个巨大的 JSON 结果。例如，当搜索键= Hollywood时，我需要返回以下JSON(仅相关分支详细信息并删除其他部分“No”:“1108”和“No”:“1107” )

[
   {
      "No":"21",
      "Area":"Default",
      "Branches":[
         {
            "No":"1105",
            "Area":"Hollywood",
            "IsValid":"False"
         }
      ]
   }
]

例如:2当搜索键=东时，我需要返回以下JSON结果。这意味着我需要在根级别和分支级别搜索区域值

[
   {
      "No":"17",
      "Area":"East",
      "Branches":[
         {
            "No":"212",
            "Area":"region109",
            "IsValid":"False"
         },
         {
            "No":"219",
            "Area":"region116",
            "IsValid":"False"
         }
      ]
   }
]

如何使用JQuery函数或其他正确的方法来做到这一点。

Answer 1

这应该可以完成工作

function FilterTree(arr, searchField, searchValue, subSearchField,  results, parentArr){
    for (var i=0 ; i < arr.length ; i++) {
        if (arr[i][searchField] == searchValue) {
            if(parentArr === undefined) results.push(arr[i]);
            else parentArr[subSearchField].push(arr[i]);

        }else if(arr[i][subSearchField] !== undefined){
            var par = JSON.parse(JSON.stringify(arr[i]))
                par[subSearchField] = []

            FilterTree(arr[i][subSearchField], searchField, searchValue, subSearchField,  results, par)
        }
    }       

    if(parentArr !== undefined && parentArr[subSearchField].length) results.push(parentArr)
    return results
    }

这将 A) 循环遍历顶层。如果找到匹配项，它将被添加到结果树中

B) 如果顶层具有指定的子级，则将再次调用该函数，并将该子级作为顶层，并将父级 (OP) 添加到另一个数组。然后，如果在子项中找到匹配项，则会将其添加到 OP，然后再将 OP 添加到循环末尾的结果树

调用示例:

FilterTree(tree, "Area", "Hollywood", "Branches", [])

其中“tree”是您的原始 JSON 对象