reading json in javascript from a get request

November 25, 2021

good day, i have been trying the read data from my json output sent from a flask json dump via javascript.

$.ajax({
type: "GET",
url: m_url+"bank_trans/get_banks/",
credentials: 'include', 
headers: {
    'AccessToken': acc,
},
success:function(data) {
  console.log(data)

  for (i=0; i<data.length; i++){
     console.log(
         data.total_amount + "<br />"
     );
  }


}

});

The output of the json dump, from console.log

[{"total_amount": 1254275355.95, "BANK_NAME": "FIRST BANK"}, {"total_amount": 49307548.55, "BANK_NAME": "GT BANK"}, {"total_amount": 100000.00, "BANK_NAME": "STANBIC IBTC BANK"}, {"total_amount": 79100000.00, "BANK_NAME": "STERLING BANK"}, {"total_amount": 50133150.68, "BANK_NAME": "UBA"}, {"total_amount": 13000000.00, "BANK_NAME": "ZENITH BANK"}]

thanks

>Solution :

For now data is a JSON content : a string, you need to load it as a JS structure, here a list of objects

Simple solution

Parse the JSON, and also use data[i].total_amount and not data.total_amount

let data = '[{"total_amount": 1254275355.95, "BANK_NAME": "FIRST BANK"}, {"total_amount": 49307548.55, "BANK_NAME": "GT BANK"}, {"total_amount": 100000.00, "BANK_NAME": "STANBIC IBTC BANK"}, {"total_amount": 79100000.00, "BANK_NAME": "STERLING BANK"}, {"total_amount": 50133150.68, "BANK_NAME": "UBA"}, {"total_amount": 13000000.00, "BANK_NAME": "ZENITH BANK"}]'
data = JSON.parse(data)
for (i=0; i<data.length; i++){
    console.log(data[i].total_amount);
}

Better solution

Regarding jquery.ajax

Use dataType: "json" to load automatically from JSON

$.ajax({
    type: "GET",
    dataType: "json",
    url: m_url + "bank_trans/get_banks/",
    credentials: 'include',
    headers: {
        'AccessToken': acc,
    },
    success: function(data) {
        console.log(data)
        for (i=0; i < data.length; i++){
            console.log(data[i].total_amount);
        }
    }
});