Javascript将数据放在列表中

问题描述 投票:0回答:1

我有一个表,我想把我从ajax调用中获取的数据放入列而不是行中这里是表体代码

<tbody id="tableData-marketMonth">
    <tr>
        <th>Leads</th>
    </tr>
    <tr>
        <th>Full Year Cost</th>
    </tr>
    <tr>
        <th>{{date('F')}} Share of Cost</th>
    </tr>
    <tr>
        <th>Cost per Lead</th>
    </tr>
</tbody>

以下是将数据放入表中的JavaScript代码

//Monthly Marketing Cost Report
$.get('/dashboard/costs', function(data){
  $.each(data,function(i,value){
    var tr =$("<tr/>");

    tr.append($("<th/>",{
      text : value.olxTotal
    })).append($("<th/>",{
      text : value.budget_total_year
    })).append($("<th/>",{
      text : value.budget_total_month
    })).append($("<th/>",{
      text : value.budget_per_lead
    }))
    $('#tableData-marketMonth').append(tr);
  })  
})

这是当前的输出Current所需的输出Desired

非常感谢你

javascript jquery mysql laravel
1个回答
1
投票

而且我想我理解你的意思,最好只是将id添加到每个<tr>然后将值附加到它们,如下所示。

HTML

<table>
    <tbody id="tableData-marketMonth">
        <tr id="leads">
            <th>Leads</th>
         </tr>
         <tr id="fyc">
             <th>Full Year Cost</th>
         </tr>
         <tr id="soc">
             <th>{{date('F')}} Share of Cost</th>
         </tr>
         <tr id="cpl">
             <th>Cost per Lead</th>
         </tr>
    </tbody>
</table>

JQuery的

//Monthly Marketing Cost Report
$.get('/dashboard/costs', function(data){
  $.each(data,function(i,value){
      var leads = $('#leads');
      var budget_total_year = $('#fyc');
      var budget_total_month = $('#soc');
      var budget_per_lead = $('#cpl');

      leads.append('<td>' + value.olxTotal + '</td>');
      budget_total_year.append('<td>' + value.budget_total_year + '</td>');
      budget_total_month.append('<td>' + value.budget_total_month + '</td>');
      budget_per_lead.append('<td>' + value.budget_per_lead + '</td>');
  })  
})
© www.soinside.com 2019 - 2024. All rights reserved.