Как искать строку JSON, используя JQuery - PullRequest
Новая
       38

Как искать строку JSON, используя JQuery

0 голосов
/ 29 апреля 2019

В моем приложении, которое использует веб-службы и этот метод веб-службы, возвращает строку 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 .Это прекрасно работает с устройствами ПК.Но с огромным набором JSON (выше JSON является частью огромного набора) kendo treeview проблема запаздывания с вкладками и мобильными устройствами.в настоящее время этот JSON я напрямую связываю с kendo treeview.Но чтобы уменьшить проблему запаздывания и повысить эффективность, мне нужно привязать строку JSON к kendo treeview после фильтрации.Тогда мне не нужно связывать весь этот огромный JSON и связывать только соответствующий JSON.Я думаю, что для достижения этого мне нужно создать другую функцию для поиска / фильтрации этих огромных результатов JSON.в качестве примера, когда search key = Hollywood мне нужно вернуть следующий JSON ( только соответствующие сведения о ветке и удалить другие части "Нет": "1108" и "Нет": "1107" ) 

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

например: 2, когда search key = East, мне нужно вернуть следующий результат JSON. Это означает, что мне нужно искать значение Area как на уровне Root, так и на уровне Branch 

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

Как это сделать с помощью функции JQuery или другим правильным способом.

Ответы [ 2 ]

2 голосов
/ 30 апреля 2019

Это должно выполнить работу 

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", [])

Где«дерево» - ваш исходный объект JSON

2 голосов
/ 30 апреля 2019

Я предлагаю подготовить источник данных Kendo.1) Считайте данные в ваш источник данных, используя транспорт

2) Источник данных кендо поддерживает операцию фильтрации

3) Привязать источник данных квид дерева 

<div id="treeview"></div>
<script>
var dataSource = new kendo.data.DataSource({
  transport: {
    read: {
      url: "https://demos.telerik.com/kendo-ui/service/products",
      dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
    }
  },
  filter: { field: "ProductName", operator: "startswith", value: "Cha" }
});

  dataSource.fetch(function(){
  var view = dataSource.view();
   $("#treeview").kendoTreeView({
  dataSource: view,
  dataTextField: "ProductName"
});
});
...