Экспорт данных Excel во вложенный JSON

Я экспортирую данные из Excel в стандартный формат JSON с помощью модуля JsonConverter VBA. Вывод JSON аналогичен приведенному ниже: -

[{
    "Manufacturer": "Ford",
    "Code": 5551234,
    "Model": "Escort"
    "Status": "Available"
  },
  {
    "Manufacturer": "Ford",
    "Code": 5551335,
    "Model": "Mondeo"
    "Status": "Out of stock"
  },
  {
    "Manufacturer": "Ford",
    "Code": 5551240,
    "Model": "Fiesta"
    "Status": "Available"
  },
  {
    "Manufacturer": "BMW",
    "Code": 5552567,
    "Model": "M1"
    "Status": "Available"
  },
  {
    "Manufacturer": "BMW",
    "Code": 5552328,
    "Model": "M2"
    "Status": "Available"
  },
  {
    "Manufacturer": "BMW",
    "Code": 5552573,
    "Model": "M3"
    "Status": "Out of stock"
  }
]

Код VBA, который я использую, выглядит следующим образом: -

Sub Excel2JSON()

Dim excelRange As Range
Dim jsonItems As New Collection
Dim jsonDictionary As New Dictionary
Dim jsonFileObject As New FileSystemObject
Dim jsonFileExport As TextStream
Dim i As Long
Dim cell As Variant

Set excelRange = Cells(1, 1).CurrentRegion

For i = 2 To excelRange.Rows.Count
    jsonDictionary("Manufacturer") = Cells(i, 1)
    jsonDictionary("Code") = Cells(i, 2)
    jsonDictionary("Model") = Cells(i, 3)
    jsonDictionary("Status") = Cells(i, 4)

    jsonItems.Add jsonDictionary
    Set jsonDictionary = Nothing
Next i

Set jsonFileExport = jsonFileObject.CreateTextFile(".../cardata.json", True)
jsonFileExport.WriteLine (JsonConverter.ConvertToJson(jsonItems, Whitespace:=3))

End Sub

Затем я импортирую этот JSON в таблицу HTML, используя следующий скрипт: -

$(document).ready(function() {
  $.ajax({
    url: "cardata.json",
    method: "GET",
    dataType: "json",
    success: function(data) {
      var $tbody = $("table#data tbody");
      $.each(data, function(i, data) {
        var $tr = $("<tr></tr>");
        $tr.appendTo($tbody);
        var $td = $("<td></td>");
        $td.html(data.Manufacturer)
          .appendTo($tr);
        $td = $("<td></td>");
        $td.html(data.Code)
          .appendTo($tr);
        $td = $("<td></td>");
        $td.html(data.Model)
          .appendTo($tr);
        $td = $("<td></td>");
        $td.html(data.Status)
          .appendTo($tr);
      });
    },
  });
});

Вопрос / проблема двоякая. Я хочу импортировать JSON в две разные HTML-таблицы, а не в одну (одна таблица для Ford, другая для BMW и т. д.). Я знаю, что приведенный ниже JSON будет работать с двумя разными таблицами, однако я не могу изменить код VBA для создания JSON, который выглядит следующим образом: -

{
  "Ford": [{
      "Code": 5551234,
      "Model": "Escort"
      "Status": "Available"
    },
    {
      "Code": 5551335,
      "Model": "Mondeo",
      "Status": "Out of stock"
    },
    {
      "Code": 5551240,
      "Model": "Fiesta",
      "Status": "Available"
    }
  ],
  "BMW": [{
      "Code": 5552567,
      "Model": "M1",
      "Status": "Available"
    },
    {
      "Code": 5552328,
      "Model": "M2",
      "Status": "Available"
    },
    {
      "Code": 5552573,
      "Model": "M3",
      "Status": "Out of stock"
    }
  ]
}

Альтернативой является сохранение того же JSON, но изменение способа, которым скрипт импортирует его в 2 разные таблицы HTML.

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

Hawasho 07.12.2018 11:06
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
1
2 386
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Ниже я изменил ваш JSON с помощью jQuery в нужном вам формате.

 $(document).ready(function(){

 $.ajax({
          url: "cardata.json",
          method: "GET",
          dataType: "json",
          success: function(data){
            var manufacturers = {};

            data.forEach(function(element) {

               if (!manufacturers[element.Manufacturer])
                   manufacturers[element.Manufacturer] = new Array();

                   var obj = {};
                   obj.Code = element.Code;
                   obj.Model = element.Model;
                   obj.Status = element.Status;
                   manufacturers[element.Manufacturer].push(obj);
            });


           console.info(manufacturers); //As object
           console.info(JSON.stringify(manufacturers)); // In JSON

          }
      });
    });

Спасибо за это. Хотя я получаю ошибки в строках с 10 по 13. Есть ли способ добавить это к определенным таблицам в HTML? I.E id = "bmw" и id = "ford" и т. д.

Hawasho 08.12.2018 20:48

Dreamweaver обнаруживает синтаксическую ошибку в строках 10 и 12. Хотя здесь не уточняется, в чем именно заключается ошибка.

Hawasho 09.12.2018 10:04

Я изменил синтаксис в строке 10. Возможно, это сработает.

Ash 09.12.2018 10:26

Большое спасибо, это работает. Я вижу данные в журнале консоли. Как мне добавить это к существующим таблицам на странице HTML? У меня есть несколько таблиц, указанных производителем. I.E id = "bmw", id = "ford" и т. д.

Hawasho 10.12.2018 10:24

Спасибо, Эш, я догадался. Я добавлю рабочий код ниже. Ваша помощь очень ценится.

Hawasho 10.12.2018 13:58

Используя код, предоставленный Эшем, таблицы теперь заполняются правильно. Возможно, я добавил данные как можно дальше, но это работает.

$(document).ready(function() {
    $.ajax({
        url: "cardata.txt",
        method: "GET",
        dataType: "json",
        success: function(data) {
            var vendors = {};

            data.forEach(function(element) {

                if (!manufacturers[element.Manufacturer])
                    manufacturers[element.Manufacturer] = new Array();

                var obj = {};
                obj.Code = element.Code;
                obj.Model = element.Model;
                obj.Status = element.Status;
                manufacturers[element.Manufacturer].push(obj);
            });

            var $tbody = $("table#BMW tbody");
            $.each(manufacturers.BMW, function(i, data) {
                var $tr = $("<tr></tr>");
                $tr.appendTo($tbody);
                var $td = $("<td></td>");
                $td.html(data.Code)
                    .appendTo($tr);
                $td = $("<td></td>");
                $td.html(data.Model)
                    .appendTo($tr);
                $td = $("<td></td>");
                $td.html(data.Status)
                    .appendTo($tr);
            });

            var $tbody = $("table#Ford tbody");
            $.each(manufacturers.Ford, function(i, data) {
                var $tr = $("<tr></tr>");
                $tr.appendTo($tbody);
                var $td = $("<td></td>");
                $td.html(data.Code)
                    .appendTo($tr);
                $td = $("<td></td>");
                $td.html(data.Model)
                    .appendTo($tr);
                $td = $("<td></td>");
                $td.html(data.Status)
                    .appendTo($tr);
            });

            console.info(manufacturers); //As object
            console.info(JSON.stringify(manufacturers)); // In JSON

        }
    });
});

Другие вопросы по теме