通过ajax将数据追加到表

Question

I'm having issue with appending my data to table body.

Code

$.ajax({
  type:'GET',
  url:'{{url('dashboard/customer-groups')}}/'+ordID,
  success:function(data){
    console.log(data);  //screenshot below
  }
});

screenshot

data returned by ajax code above in 2 categories (group and customers)

HTML

<table id="data-table" class="table table-striped table-bordered">
    <thead>
    <tr>
        <th>#</th>
        <th>Name</th> // from customers array
        <th>Company</th> // from customers array
        <th>Province</th> // from customers array
        <th>City</th> // from customers array
        <th>Email</th> // from customers array
        <th>Industry</th> // from customers array
        <th>Group</th> // from group
    </tr>
    </thead>
    <tbody id="table_customer"></tbody>
</table>

Any idea?

Answer 1

    $.ajax({
      type:'GET',
      url:'{{url('dashboard/customer-groups')}}/'+ordID,
      success:function(data){
        const tr = $('tr');
        for (var key in data) {
           var obj = data[key];
           var id = "<td>"+obj.id+"</td>";
var group_id = "<td>"+obj.group_id+"</td>";


     // add more columns for other attributes
           var allTds = id+group_id;
         }
        tr.append(allTds);
       $('#data-table').append(tr);
      }
    });