Question

我试图了解DataTables，但发现它很困难。我有一个表单，用户可以使用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数组？
我需要使用mData吗？
我是否需要使用columnDefs？
在专栏中，我需要“标题”和“数据”吗？

Answer 1

解决！我已将我的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>

使用带有php和动态列的DataTable

1 个答案: