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

我有一个来自数据库的数据。以及在调用ajax函数时显示。我可以展示它。但是，其中一个变量是数组数据，并使用内爆函数保存它。数据类似于（a，b，c，d）

数据以以下格式显示

数据1数据2数据3（a、b、c、d）数据5等等

我想分解数组数据，然后在另一个下面打印一个

我应该像这样展示它

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>

$（'#genreport'）。在（'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({
键入：“get”，
url:url，
数据：{Representativeid:Representativeid，dateFrom:dateFrom，dateTo:dateTo}，
成功：功能（数据）{
控制台日志（数据）；
var$tabledata=$（“#tbody”）；
$tabledata.empty（）；
for（数据中的元素）
{
变量行=“”+
“”+数据[元素]。日期+“”+
''+数据[元素]。医生姓名+''+
'@foreach（分解（'，，数据[元素].products）为$product）
{{$product}}
@endforeach“+
''+数据[元素]。数量+''+
''+数据[元素]。位置+''+
''+数据[元素]。区域+''+
'';
$（'#tbody'）。追加（行）；
}
},
错误：函数（数据）
{
警报（“失败”）；
警报（数据）；
}
});
});

我对每一种逻辑的理解都失败了。请帮助我按预期显示。

只需在

foreach

中添加

编辑：

---

另外，看看这个链接

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

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

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

然后需要获取数组计数（.length）才能使用

行span

，这样它就不会破坏表结构

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

var rowSpan=productsArray.length；
....
“”+数据[元素]。日期+“”+
....

---

最后，需要在数组中循环使用javascript，而不是php。（注意，因为

我可以显示您的错误吗？（1）您不能在javascript（客户端）中使用php函数/代码（服务器端）。（2）你的
循环将破坏你的行结构，除非你在另一行
上使用
行span
，否则我没有任何错误。我可以以a、b、c、d格式显示。但我无法分解和打印一个接一个的数据。@Sean:你能指导我以所需格式显示它吗？@foreach（explode（，），data[element].products）作为$product）{{$product}@endforeach''+这看起来好吗？是的。你可能需要处理字符串concat。这就是我对字符串concat的意思。使用
+
和
'
。这是我更新的代码。'@foreach（explode）（'，'，data[element].products）作为$product'''''''+{{$product}+''''+@endforeach''+获取未定义的数据。因此在引号中添加了它们。然后获取语法错误：意外的字符串错误。您可以帮助我更改代码吗。@OukaashaHabib OP应该如何在javascript中使用php代码。如果不想使用
行span
，请查看使用@OukaashaHabib建议在产品
中插入
。最终结果类似。非常感谢您花费宝贵的时间重新编写代码并将事情解释得非常清楚。感谢您的帮助谢谢您的帮助。我已经替换了ajax代码。我收到了以下问题。reports:285未捕获引用错误：在XMLHttpRequest的z（jquery-2.2.3.min.js:4）处的i（jquery-2.2.3.min.js:2）处（jquery-2.2.3.min.js:2）处的i（jquery-2.2.3.min.js:2）处未定义计数（报告：285）一个谷歌搜索建议我降级jQuery版本。但这对我来说是一个php/javascript错误。应该是
productsArray.length
，而不是
count（productsArray）
，因为
count（）
是一个php函数
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);
                    }