заполнить динамические столбцы на основе выбора пользовательского столбца с помощью Oracle Jet + нокаут JS +asticsearch - PullRequest
Новая
       23

заполнить динамические столбцы на основе выбора пользовательского столбца с помощью Oracle Jet + нокаут JS +asticsearch

0 голосов
/ 05 октября 2018

В разработке моего сайта я предоставил выпадающий список, где пользователь может выбирать столбцы для отображения, а данные будут выбираться и представляться в соответствии с запросами пользователей.Таким образом, я предоставил выбор поля со списком, как показано ниже, 

<div id="filterColumns" style="width: 1px; min-width: 100%;">
  <oj-label for="multiSelect">Select Columns</oj-label>
  <div id="columnsList">
    <oj-select-many help.instruction="Select the columns to populate the data" id="multiSelect" value={{selectedColumns}} style="max-width:50em">
      <oj-option value="Name">Name</oj-option>
      <oj-option value="Age">Age</oj-option>
      <oj-option value="Gender">Gender</oj-option>
      <oj-option value="Mainden Name">Mainden Name</oj-option>
      <oj-option value="Mothers Name">Mothers Name</oj-option>
      <oj-option value="Designation">Designation</oj-option>
      <oj-option value="Experience">Experience</oj-option>
      <oj-option value="Company">Company</oj-option>
      <oj-option value="Location">Location</oj-option>
    </oj-select-many>
  </div>
  <oj-button id='filterColumnsGo' on-oj-action='[[generateData]]'>Generate Data</oj-button>
</div>

. И в ViewModel я получаю имена столбцов, выбранные пользователем, 

self.selectedColumns = ko.observableArray(document.getElementById('columnsList'));

и вызываю API Elasticsearchс данными, основанными на выборе.

Ниже приведен ответ одного из данных, 

{
  "_index": "person_data",
  "_type": "_doc",
  "_id": "moahn",
  "_score": 1,
  "_source": {
    "person_details": {
      "age": 23,
      "gender": "male",
      "mothers_name": "Jabito",
      "mainden_name": "Rosoku",
      "designation_info": {
        "designation_name": "Architect",
        "company": {
            "company_location": "Delhi",
            "experience": 4,
        }
      }
    }
  }
}

Ищу способ разбора данных в том же порядке, когда пользователь выбрал имена столбцов в выпадающем списке.Я пытался перебрать, как показано ниже, и для каждого цикла пытался зациклить извлеченные данные, но не работал, как ожидалось, 

self.selectedColumns().forEach(function(col){
  tempCols.push({headerText: col, field: col});
  ...
  ...
});

Поскольку Elasticsearch не предоставляет детали имени элемента, где я могу простополучите его, и данные, возвращаемые ES, будут иметь вложенный результат в формате JSON, имя которого не будет совпадать с именем, отображаемым для выбора пользователя в поле со списком.Любая помощь будет оценена

1 Ответ

0 голосов
/ 06 октября 2018

Самый простой способ сделать это - создать файл схемы, подобный схеме, где вы указываете, как столбцы сопоставляют поля с полями один к одному.Таким образом, вы можете сделать что-то вроде этого: 

ColumnDataMapping: {
   "age": { field: "age", label: "Age" }
   "mothersName": { field: "mothers_name", label: "Mothers Name" },
   "designation": { field: "designation_info.designation_name", label: "Designation" }
   "location": { field: "designation_info.company.company_location", label: "Location" }
   ...
}

Затем в вашей модели представления, используя это отображение, вы можете получить столбцы и поля, в которые они отображаются.Обратите внимание, что в вашем поле со списком вы бы не имели те же значения, что и метки.Ваши значения будут keys в ColumnDataMapping, а ваши метки - полями label.

Таким образом, вы можете быть гибкими со своим кодом, поскольку все, что вас волнует, это правильная конфигурация«схема».Таким образом, вы извлекаете из кода знания о том, как сопоставляются поля и т. Д.

Теперь это также позволяет вам сохранять эту «схему» и настраивать ее.Вы также можете добавить любые поля, которые хотите расширить ... например, enabled для поля и т. Д.

...