Вложенная строка JSON в таблицу данных - PullRequest
Новая
       5

Вложенная строка JSON в таблицу данных

0 голосов
/ 27 ноября 2018

Пожалуйста, помогите.Я не могу сопоставить проанализированные значения JSON с именем клиента с помощью таблиц данных.Мне удалось заполнить столбец таблицы контактной информацией, но проанализированные данные идентичны для обеих учетных записей в таблице, созданной с помощью показанного кода.Есть ли лучший способ перебрать данные, чтобы они отображались правильно.

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Table 01</title>
</head>
<body>

<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

<table id="tableId" class="table table-condensed responsive"></table>

</body>
<script>

    var data01 = [
  {
  "name": "EXAMPLE Mickey",
  "due": "2018-11-22T19:00:00.000Z",
  "labels": [
    {
    "name": "Salesperson_1",
    "color": "green"
    }
    ],
  "pluginData": [
          {
          "value": "{\"billContact\":\"Mickey Mouse\",\"billCompany\":\"MM Clubhouse\"}",
          "access": "shared"
          }
      ]
  },
  {
  "name": "EXAMPLE Carl",
  "due": "2018-11-25T19:00:00.000Z",
  "labels": [
    {
    "name": "Salesperson_2",
    "color": "yellow"
    }
    ],
  "pluginData": [
          {
          "value": "{\"billContact\":\"Carl Grimes\",\"billCompany\":\"Rick's Group\"}",
          "access": "shared"
          }
      ]
  }
];


$('#tableId').DataTable({
  data: data01,
  "columns": [
    {"data": "name"},
    {"data": "due"},
    {"data": "labels.0.name"},
    {"data": "pluginData.0.value"},  
    {"data": function(){

      for (var i=0; i < data01.length; i++){
        var values = data01[i].pluginData[0].value;


        var parsedVal = JSON.parse(values);

        var contact = parsedVal.billContact;      

        return contact;

        //console.log(contact);
      }
    }}
  ]
});

</script>


</html>

1 Ответ

0 голосов
/ 27 ноября 2018

Когда вы передаете функцию в столбец, этой функции передается аргумент, представляющий одну запись ваших данных.Таким образом, нет необходимости перебирать свои данные самостоятельно, jQuery сделает это за вас. 

$('#tableId').DataTable({
  data: data01,
  "columns": [
    {"data": "name"},
    {"data": "due"},
    {"data": "labels.0.name"},
    {"data": "pluginData.0.value"},  
    {"data": function (row){

      let values = row.pluginData[0].value;

        let parsedVal = JSON.parse(values);

        let contact = parsedVal.billContact;      
        return contact;
    }}
  ]
});

Если вы выполните итерацию самостоятельно, функция завершится в операторе return.Поэтому каждый раз, когда вызывается функция, она просто видит первую запись, возвращает ее и останавливается в этой точке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...