Question

我有一个来自数据库的数据。并且在调用ajax函数时显示。我能够显示它。但是，变量之一是数组数据，并使用爆破功能将其保存。数据就像（a，b，c，d）。

数据以以下格式显示

data1 Data2 Data3（a，b，c，d）Data5等。

我想爆炸数组数据并在另一个下面打印。

我应该像这样显示

data1 data2 data3  a  data5
                   b
                   c
                   d

这是我为获取数据而编写的代码。

<script type="text/javascript">
                    $('#genreport').on('click',function(){
                    var Representativeid = document.getElementById("Representativeid").value;
                    var dateFrom = document.getElementById("dateFrom").value;
                    var dateTo = document.getElementById("dateTo").value;
                    var url = '{{URL::to('/admin/GenReport')}}';
                    $.ajax({
                      type : 'get',
                      url  : url,
                      data : {Representativeid:Representativeid,dateFrom:dateFrom,dateTo:dateTo},
                      success:function(data){
                        console.log(data);
                        var $tabledata = $('#tbody');
                        $tabledata.empty();
                        for (element in data)
                        {

                          var row = '<tr>' +
                             '<td>' + data[element].date + '</td>'+
                             '<td>' + data[element].doctor_name + '</td>'+
                             '<td>' @foreach(explode(',', data[element].products ) as $product) 
                                {{$product}}    
                             @endforeach '</td>' +
                              '<td>' + data[element].quantity + '</td>'+
                             '<td>' + data[element].locations +'</td>'+
                             '<td>' + data[element].area + '</td>'+
                             '</tr>';
                           $('#tbody').append(row);
                        }
                      },
                      error:function(data)
                      {
                        alert('fail');
                        alert(data);
                      }
                    });
                  });
                </script>

我无法使用for-each逻辑。请帮助我按预期显示。

Answer 1

您无法在javascript / jQuery代码（客户端）中使用php函数/代码（服务器端），因为将在加载页面之前解析php代码。相反，您需要使用javascript代码。

首先，您需要将值拆分为一个数组

var productsArray = data[element].products.split(',');

然后，您需要获取数组计数（.length）才能使用rowspan，以免破坏表结构

var rowSpan = productsArray.length;
....
'<td rowspan="'+rowSpan+'">' + data[element].date + '</td>'+
....

最后，您需要通过数组循环执行javascript，而不是php。（请注意，由于i<0 <td>位于后面的行中，因此需要在之后添加它们）

var rowAfter = "";
for (var i = 0; i < rowSpan; i++) {
  if(i == 0) {
    row += '<td>' + productsArray[i] + '</td>';
  } else {
    rowAfter += '<tr><td>' + productsArray[i] + '</td></tr>';
  }
}

所以看起来像这样-

                    for (element in data)
                    {
                      // get products into an array
                      var productsArray = data[element].products.split(',');
                      // get products array count
                      var rowSpan = productsArray.length;

                      var row = '<tr>' +
                         '<td rowspan="'+rowSpan+'">' + data[element].date + '</td>'+
                         '<td rowspan="'+rowSpan+'">' + data[element].doctor_name + '</td>';

                      // loop through products array
                      var rowAfter = "";
                      for (var i = 0; i < rowSpan; i++) {
                        if(i == 0) {
                          row += '<td>' + productsArray[i] + '</td>';
                        } else {
                          rowAfter += '<tr><td>' + productsArray[i] + '</td></tr>';
                        }
                      }

                      row += 
                         '<td rowspan="'+rowSpan+'">' + data[element].quantity + '</td>'+
                         '<td rowspan="'+rowSpan+'">' + data[element].locations +'</td>'+
                         '<td rowspan="'+rowSpan+'">' + data[element].area + '</td>'+
                         '</tr>';
                       // append both row and the <td>s in rowAfter
                       $('#tbody').append(row+rowAfter);
                    }

Answer 2

只需在<tr><td>内添加foreach。

编辑： 另外，请查看此链接。 table inside a td

从数据库获取的Ajax数据显示

2 个答案: