时间戳

首页 > 解决方案 > Omines 数据表和列宽

symfony - Omines 数据表和列宽

问题描述

我尝试将 Omines 数据表包与 symfony (4) 一起使用，但我无法强制列宽...我已经看过这个页面 https://github.com/omines/datatables-bundle/issues/71 所以我试过了建议的解决方案，但这就像我什么都没做：我所有的列都有相同的宽度。

我忘了什么吗？

这是我的控制器：

    public function actionList2(Request $request, DataTableFactory $dataTableFactory): Response
    {
    $options = [
        'fixedHeader' => false,
        'serverSide' => false,
        'processing' => true,
        'searching' => true,
        'autoWidth' => false,
        'columnFilter' => 'both',
        'pageLength' => null,
        'paging' => false,
    ];

    $table = $dataTableFactory->create($options)
        ->add('actCod', TextColumn::class, ['label' => 'Code', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actLib', TextColumn::class, ['label' => 'Libellé', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actIdMere', TextColumn::class, ['label' => 'Action mère', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actDatCmd', DateTimeColumn::class, ['label' => 'Commande', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actDatMep', DateTimeColumn::class, ['label' => 'MEP', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actUsrCre', TextColumn::class, ['label' => 'User Cre', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actDatCre', DateTimeColumn::class, ['label' => 'Date Cre', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->add('actDatMod', DateTimeColumn::class, ['label' => 'Date Mod', 'searchable' => true, 'filter' => ['templateHTML' => 'datatables/Filter/text.html.twig', 'placeholder' => null]])
        ->createAdapter(ORMAdapter::class, ['entity' => V8Action::class
        ])
        ->handleRequest($request);

    if ($table->isCallback()) {
        return $table->getResponse();
    }

    return $this->render('list2.html.twig', ['datatable' => $table]);

}

还有我的树枝...

{# /templates/list.html.twig #}
{% extends 'base.html.twig' %}

{% block titre %}liste{% endblock%}

{% block stylesheets %}
    {{ parent() }}
{% endblock%}

{% block page_content %}
<a href="{{ path('home') }}">Home</a><br/>

<div id="list">Loading...</div>

{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {{ encore_entry_script_tags('list2') }}
    <script>
$(document).ready(function() {
    $('#list').initDataTables({{ datatable_settings(datatable) }}
           ,{
                columnDefs: [
                    {width: "30%", targets: [1]},
                ]
            }
        );
    });
    </script>
{% endblock %}

不使用列的宽度。

但是，我在 Omines datatable.js 中放置了一个 console.log ：

    root.html(data.template);
    dt = $('table', root).DataTable(dtOpts);
    console.log(dtOpts);

我可以在 dtOpts oO 中看到我的 columnDefs

标签： symfonydatatables

解决方案

对我来说，我在我的树枝上做过这样的事情

table2 = $('#Dcfdatatables').initDataTables({{ datatable_settings(datatable) }} , {
"pageLength": 10,
dom: '<"top"lf>rt<"bottom"ip><"clear">',
"lengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100,
columnDefs: [
    {width: "4%", targets: 0, title:"<input type='checkbox' id='select_all' name='select_all'>"},
    {width: "6%", targets: 1},
    {width: "13%", targets: 2},
    {width: "7%", targets: 3},
    {width: "26%", targets: 4},
    {width: "22%", targets: 5},
    {width: "12%", targets: 6},
    {width: "10%", targets: 7},
],initComplete: function(){
...
}

为我工作。

推荐阅读