How to insert json objects into a table?

Question

JavaScript

C DB comes as a string String json :

{"tables": [{"Ext_TeleserviceCode":"11","Ellipsis":"","NACarrierID":"","CallingPartyNumber":"93967767","CamelBusy":"","GSM_ForwardingPending":"","EventTypeBCSM0":"C0"},
{"Ext_TeleserviceCode":"12","Ellipsis":"","NACarrierID":"","CallingPartyNumber":"93939643","CamelBusy":"","GSM_ForwardingPending":"","EventTypeBCSM0":"C0"}]}

Then I get to pull out each json object separately. I need to draw a table on the web interface where all these values ​​would be added.
I looked for examples, JavaScript appears everywhere. Type example:

function CreateTableFromJSON() {
        var myBooks = [
            {
                "Book ID": "1",
                "Book Name": "Computer Architecture",
                "Category": "Computers",
                "Price": "125.60"
            },
            {
                "Book ID": "2",
                "Book Name": "Asp.Net 4 Blue Book",
                "Category": "Programming",
                "Price": "56.00"
            },
            {
                "Book ID": "3",
                "Book Name": "Popular Science",
                "Category": "Science",
                "Price": "210.40"
            }
        ]

But at me all these values ​​are stored in one variable.
Please tell me if it is possible in some way to put the String json variable into the JavaScript structure or what other solutions to the problem can be.

Answer 1

It's all about parsing. Here you get a large JSON string as a JSON parameter. then do the following:

(json) => {
  let parsedData = JSON.parse(json);
}

You now have an object from which you can get your tables variable, which is an array. To convert a single array into an object like the one you provided, you need a reduce method.
If you are good with English, then I advise you to watch the first and second parts of a good lesson on reduce. If not in trouble, then read the documentation. In short, reduce is a powerful tool that turns an array into one object, be it a collection, another array, or a string. In your case, you need to convert the array to a collection.

Answer 2

explain how you get json on the frontend? Php, Java on the back? Receive an object / array on the backend (a bunch of functions for everything), it is already output to the front from the array.

Answer 3

Assign the json string to the variable. We iterate in a loop and insert the data in the necessary places.

var collection = '{"tr": [{"td1": "name1","td2": "name2"},{"td1": "name1","td2": "name2"}]}';
var tr += '';
$.each(collection, function(i, tr){
tr += '<tr><td>'+tr.td1+'</td><td>'+tr.td2+'</td></tr>';
});
$('table').html(tr);

It's figurative. It would be more correct to clone a row from an existing table and substitute data into it.

Answer 4

You can turn json into an object like this:

// json
var json = '{"foo": "bar", "lorem": "ipsum"}';

// Парсим в объект
var obj = JSON.parse(json);

// в цикле обходим свойства объекта
// добавляя значения в таблицу
for (var i in obj) {
  var td = document.createElement('td');
  td.innerHTML = obj[i];
  tr.appendChild(td);
}

In reality, the algorithm is a little more complicated, because it is necessary to make headings of columns from keys, and from values ​​- cells. But this is another topic)
ps
If you have an array of objects, then you need to traverse the array in one cycle, and for each object in the array, perform the traversal in the above cycle.