基于数据属性有条件地隐藏数据表列

Question

我有以下问题：

我想有条件地显示datatable中的一列。特别是kt数据表中的actions列。（Laravel的Metronic主题有自己的Datatables实现，它基于jQuery Datatables。）我一直在看专栏。渲染方法，但我不能完全理解它。理想情况下，我希望根据与datatable的html一起传递的数据属性显示一列。

HTML:

<div id="datatable-example" data-isadmin="{{ auth()->user()->hasRole(['superadmin', 'admin']) }}"></div>

js/jquery：

example_datatable = example_element.DataTable({
        search: {
            input: $('#generalSearch'),
        },
        rows: {
            ...
        },
        columns: [
            ...,
            {
                field: 'actions',
                title: sendings_element.data('column-actions'),
                class: 'w8',
                textAlign: 'right',
                sortable: false,
                template: function (row) {
                    if (sendings_element.data('user_roles')) {
                        return '<a class="btn btn-danger" href="' + sendings_element.data('route-edit-sending').replace('__id__', row.id) + '">' + sendings_element.data('text_edit') + '</a>';
                    } else {
                        return '<a class="btn btn-danger" href="' + sendings_element.data('route-view-sending').replace('__id__', row.id) + '">' + sendings_element.data('text_view') + '</a>';
                    }
                }
            },
        ],
    });

我真的很感激你的帮助。

更新：

我找到了一个可行的解决方案：

<div id="datatable-id"
         ...
         data-isadmin="{{ auth()->user()->hasRole('super-admin') ? "true"  : "false" }}" 
    ></div>

在我的javascript中：

 kb_datatable = kb_element.customDataTableThatExtendsKTDatatable({      
        ...    
        columns: [          
           ...
            {
                field: 'description',
                title: kb_element.data('column-description'),
                width: 600,
                template: function(row) {
                    if(kb_element.data('isadmin')){                     
                        kb_datatable.column(1).visible(false);
                    }
                },
            },           
            ...

            },
        ],
    });

我还不满意这个解决方案，因为我正在使用一个行模板来隐藏列。但它现在起作用了。

@remul：是的，我正在使用KT-Datable，我不确定报告这个问题的同事是否在他的代码中。好接球！我刚刚设置了一个测试用例，使用一个自定义的数据可扩展ktdatable。我已经接受了你的答案作为解决方案，因为你给我指出了正确的方向，但问题是可见属性期望一个真或假，因此在html代码中缩短。理想情况下，我想为列的回调函数，但我能找到的唯一有点像它的是模板方法。此外，如果我在列对象中的可见属性上使用缩写的结果，我遇到了一个奇怪的错误，我需要将其他列设置为空，并且不能为其他列设置其他属性。使用带目标和可见的哥伦布是另一种解决方案，但我也不能做到这一点。

Answer 1

将可见属性添加到操作列应该可以做到这一点，但是当使用stateSave时，只要有一个可数据对象的保存状态，更改data-属性就不会有任何效果。为了避免这种情况，您可以从状态中删除可见性，除非在这里提到：

如果您不想保存列可见性，您可以从状态对象中的对象列数组中删除可见参数：

stateSaveParams: function ( settings, data ) {
  for ( var i=0, ien=data.columns.length ; i<ien ; i++ ) {
    delete data.columns[i].visible;
  }
}

所以在你的情况下：

columns: [
    {
        field: 'actions',
        visible: !!example_element.data('isadmin')
        // your other attributes
    },
],
stateSaveParams: function ( settings, data ) {
    for ( var i=0, ien=data.columns.length ; i<ien ; i++ ) {
        delete data.columns[i].visible;
    }
}