how to display data with javascript [object]

Question

Please Help Me data does not appear in the div result and display [object] how to fix it?

 <div id="result">
 </div>
 <script>
    jQuery(document).ready(function($){
    var html = 'Sedang memproses data';
    $('#result').html(html);
    $('#result').css('background','none');
    $.getJSON( "get.php?nopel=<?php echo $idp;?>", function(data) {
      if(data) {
          html = '<h2>Berikut Tagihan Listrik Anda</h2><table>';
          $.each(data,function(x,y){
              html += '<tr><td>'+x.replace('_','/')+'</td><td>'+y+'</td>';
          });
          html += '</table>';
          $('#result').html(html);
      }
      else {
           $('#result').html('Tidak ada data');
      }
    });
   });
</script>

with json data like this, how to invite it to JavaScript

{
 "status": "success",
  "data": [
{
  "Info": "A",
  "hasil": "AA"
},
{
  "Info": "B",
  "hasil": "BB"
}
 ]
}

console.log (data)

sounds like you want `$.each(data.data` instead of `$.each(data`, since the response has a `data`key holding an array. As a side, funny note, I've never ever seen someone saying that he needs to "invite" json data to javascript. That's weird. — briosheje, Jul 05 '19 at 08:45
Amazingly similar question to one I [remember seeing yesterday](https://stackoverflow.com/questions/56891313/how-to-display-data-with-javascript) — freefaller, Jul 05 '19 at 08:52
@MedicalClinic that is in your code above. where you write `$.each(data, function(x,y){` change `data` to `data.data` — Matt Ellen, Jul 05 '19 at 08:54
I have done $ .each (data.data, function (x, y) data does not appear @MattEllen — , Jul 05 '19 at 08:56
@MedicalClinic please `console.log(data);` and post it above, so that we can do further work. — briosheje, Jul 05 '19 at 08:56
@briosheje, after I tried doing console.log (data); data appears, but he doesn't appear in the div, there might be a mistake in my JavaScript — , Jul 05 '19 at 09:01

score 2 · Accepted Answer · answered Jul 05 '19 at 09:06

Firstly, please don't use multiple accounts to ask the same question.

There are two main issues with your code...

As pointed out in comments by multiple people, if you want the dataproperty in your data json object, then you need to use data.data instead of data
The $.each function passes two parameters (index and value), but it appears that you think that it's passing the two properties of the object.

The below has the two changes, where you can see I've changed function(x,y) to function(i,v) where v is the object. I'm then using v.Info and v.hasil...

var data = 
{
 "status": "success",
  "data": [
    {
      "Info": "A",
      "hasil": "AA"
    },
    {
      "Info": "B",
      "hasil": "BB"
    }
 ]
}

$(function(){
  var html = 'Sedang memproses data';
  $('#result').html(html);
  $('#result').css('background','none');
  //$.getJSON( "get.php?nopel=<?php echo $idp;?>", function(data) {
    if(data) {
        html = '<h2>Berikut Tagihan Listrik Anda</h2><table>';
        $.each(data.data,function(i,v){
            html += '<tr><td>'+v.Info.replace('_','/')+'</td><td>'+v.hasil+'</td>';
        });
        html += '</table>';
        $('#result').html(html);
    }
    else {
         $('#result').html('Tidak ada data');
    }
  //});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="result">
</div>

how to display data with javascript [object]

1 Answers1