使用php和动态列的DataTable

using DataTable with php and dynamic columns

本文关键字：DataTable 动态 php 使用更新时间：2023-09-26

我试图得到我的头周围的数据表，但发现它很难。我有一个表单，用户可以粘贴1+行数据和1+列信息。

可以像下面这样:

a   b   c   d   e   f   g   h   i   j
443 39  70  10  38  11  161 15  477 318
99  452 229 11  63  23  38  104 190 100

在我处理并验证它之后，它可以像下面这样使用(PHP var_dump()):

array (size=2)
  1 => 
    array (size=10)
      0 => string '443' (length=3)
      1 => string '39' (length=2)
      2 => string '70' (length=2)
      3 => string '10' (length=2)
      4 => string '38' (length=2)
      5 => string '11' (length=2)
      6 => string '161' (length=3)
      7 => string '15' (length=2)
      8 => string '477' (length=3)
      9 => string '318' (length=3)
  2 => 
    array (size=10)
      0 => string '99' (length=2)
      1 => string '4s52' (length=4)
      2 => string '22s9' (length=4)
      3 => string '11' (length=2)
      4 => string '63' (length=2)
      5 => string '23' (length=2)
      6 => string '38' (length=2)
      7 => string '104' (length=3)
      8 => string '190' (length=3)
      9 => string '100' (length=3)

或

array (size=2)
  1 => 
    array (size=10)
      'a' => string '443' (length=3)
      'b' => string '39' (length=2)
      'c' => string '70' (length=2)
      'd' => string '10' (length=2)
      'e' => string '38' (length=2)
      'f' => string '11' (length=2)
      'g' => string '161' (length=3)
      'h' => string '15' (length=2)
      'i' => string '477' (length=3)
      'j' => string '318' (length=3)
  2 => 
    array (size=10)
      'a' => string '99' (length=2)
      'b' => string '4s52' (length=4)
      'c' => string '22s9' (length=4)
      'd' => string '11' (length=2)
      'e' => string '63' (length=2)
      'f' => string '23' (length=2)
      'g' => string '38' (length=2)
      'h' => string '104' (length=3)
      'i' => string '190' (length=3)
      'j' => string '100' (length=3)

我说"或"，因为我可以输出任何一种方式-如果json与列名更好，我将做第二种方式。

我的HTML代码(使用Twig)是:

<table class="table" id="Panda1"></table>
<script type="text/javascript">
    $('#{{ Panda1 }}').dataTable( {
        "data": [{{ contentsArray | json_encode() | raw }}],
        "columns": [
            {% for column in ColumnArray %}
                { "title": "{{ column }}" },
            {% endfor %}
        ]
    } );
</script>

我的输出渲染是:

<script type="text/javascript">
    $('#Panda1').dataTable( {
        "data": [{"1":{"a":"443","b":"39","c":"70","d":"10","e":"38","f":"11","g":"161","h":"15","i":"477","j":"318"},"2":{"a":"99","b":"4s52","c":"22s9","d":"11","e":"63","f":"23","g":"38","h":"104","i":"190","j":"100"}}],
        "columns": [
            { "title": "a" },
            { "title": "b" },
            { "title": "c" },
            { "title": "d" },
            { "title": "e" },
            { "title": "f" },
            { "title": "g" },
            { "title": "h" },
            { "title": "i" },
            { "title": "j" },
        ]
    } );
</script>

我的问题是:

如何正确处理PHP数组?
我需要使用columnDefs吗?
在列中，我需要"title"answers"data"吗?

解决!我已经改变了我的javascript如下:

<script type="text/javascript">
    // Gets an array, containing an object with a single property, the property containing many objects
    // Then, we take the object which is the first element with [0]
    var myObj = [{{ contentsArray | json_encode() | raw }}][0];
    // We then iterate over the object's properties to get our rows.
    var array = Object.keys(myObj).map(function (key) {return myObj[key]});
    $('#{{ Panda1 }}').dataTable( {
        "data": array,
        "columns": [
            {% for column in ColumnArray %}
                { "title": "{{ column }}", "data": "{{ column }}" },
            {% endfor %}
        ]
    } );
</script>