数据表不显示所有表列

时间:2015-09-18 17:11:00

标签: html twitter-bootstrap datatable twig html-table

我有一个非常奇怪的bahaviour与图书馆DataTable。

我有一个带有14个元素循环的经典表构建。当显示正常时,一切都会出现,当我将其设为DataTable时,最后4列会消失。

我的代码,其中horizo​​n具有值14(已测试)且仅显示循环的10列(如果我删除DataTable类,则显示所有内容):

<table id="ingredients_table" class="table DataTable">
    <thead>
        <tr>
            <th>Produit</th>
            <th>Marque</th>
            <th title="Quantité disponible dans un produit" data-toggle="tooltip" data-placement="top">Packaging</th>
            <th title="Unité de gestion des stocks" data-toggle="tooltip" data-placement="top">UGS</th>
            <th>Stock min</th>
            <th>Stock actuel</th>
            <th class="text-right">J+</th>
            {% for i in 1..horizon %}
                <th>{{ i }}</th>
            {% endfor %}
        </tr>
    </thead>
    <tbody>
    {% spaceless %}
        {% for ingredient in ingredients -%}
            <tr data-table_form_id="{{ ingredient.id }}" data-id="{{ ingredient.id }}" data-repo="AppBundle:FoodAnalytics\UserIngredient">
                <td>{{ ingredient.getInferredName }}</td>
                <td>{{ ingredient.getProductBrand }}</td>
                <td>{{ ingredient.getProductPackaging }}</td>
                <td style="min-width: 100px !important;" data-table_form_value="{{ ingredient.unit.id }}">
                    {{ ingredient.unit }}
                </td>
                <td style="min-width: 70px !important;">
                    {{ ingredient.stockMini | round_quantity }}
                </td>
                <td style="min-width: 70px !important;">
                    {{ ingredient.getLastNumberObjectValue() }}
                </td>
                <td><span class="sparkline" data-id="{{ ingredient.id }}"></span></td>
                {% for i in 1..horizon %}
                    {% if stocks[ingredient.id][i] < 0 %}
                        {% set class = 'text-danger' %}
                    {% elseif stocks[ingredient.id][i] < ingredient.stockMini %}
                        {% set class = 'text-warning' %}
                    {% endif %}
                    <td{% if class is defined %} class="{{ class }}"{% endif %}>
                        {{ stocks[ingredient.id][i]|round_quantity }}
                    </td>
                {% endfor %}
            </tr>
        {% endfor %}
    {% endspaceless %}
    </tbody>
    <tfoot>
    <tr>
        <th>Produit</th>
        <th>Marque</th>
        <th title="Quantité disponible dans un produit" data-toggle="tooltip" data-placement="top">Packaging</th>
        <th title="Unité de gestion des stocks" data-toggle="tooltip" data-placement="top">UGS</th>
        <th>Stock min</th>
        <th>Stock actuel</th>
        <th class="text-right">J+</th>
        {% for i in 1..horizon %}
            <th>{{ i }}</th>
        {% endfor %}
    </tr>
    </tfoot>
</table>

$('.DataTable').DataTable({iDisplayLength: 50, responsive: true});

有人知道出了什么问题吗?

Table only displaying 10 of the loop 14 columns

1 个答案:

答案 0 :(得分:1)

试试这个:

$(document).ready(function(){
$('.DataTable').DataTable({iDisplayLength: 50, responsive: true});
});