如何动态使jQuery DataTable的列消失

Question

这是有关我的开发环境的信息：

• Microsoft Visual Studio专业版2013

• .NET Framework 4.0

• jQuery-2.1.4.min.js

• jQuery数据表1.10.7

• Newtonsoft.Json.7.0.1

• jQuery UI 1.11.2

  var GetAUsersLogs = function (sortColumn, isDescending) {
            $('#PersonalUsersLogTable').DataTable({
                "aoColumns": [
                            { "sTitle": "LogBsonValueId" },
                            { "sTitle": "UserID" },
                            { "sTitle": "Driver Name" },
                            { "sTitle": "Log Date" },
                            { "sTitle": "Duty Cycle" },
                            {
                                "mData": null,
                                "mRender": function (obj) {
                                    return '<a href="#" id="' + obj.DT_RowId + '" onclick="ViewLogAuditHistory(this)"  >Log Hist</a>';
                                }
                            },
                            {
                                "sTitle": "Details",
                                "mData": null,
                                "mRender": function (obj) {
                                    return '<a href="#" id="' + obj.DT_RowId + '" onclick="ViewParticularLogsInfo(this)"  >View</a>';
                                }
                            }
            ],
            "aoColumnDefs": [{ "bVisible": false, "aTargets": [0, 1, 5] }],
            "iDisplayLength": 5,
            "sDom": '<"clear">frtip',
            "bProcessing": true,
            "bServerSide": true,
            "bLengthChange": false,
            "bPaginate": true,
            "bDestroy": true,
            "bSort": false,
            "bInfo": true,
            "bFilter": false,
            "sAjaxSource": 'LogsList.aspx/BindPersonalUsersLogDataTable',
            "bJQueryUI": true,
            "bDeferRender": true,
            "sPaginationType": "full_numbers",
            "fnServerParams": function (aoData) {
                aoData.push(
                            { "name": "sortColumn", "value": sortColumn },
                            { "name": "isDescending", "value": isDescending }
                );
            },
            "fnServerData": function (sSource, aoData, fnCallback) {
                $.ajax({

                    "dataType": 'json',
                    "contentType": "application/json; charset=utf-8",
                    "type": "GET",
                    "url": sSource,
                    "data": aoData,
                    "success":
                            function (msg) {
                                var json = jQuery.parseJSON(msg.d);
                                fnCallback(json);

                            },

                    beforeSend: function () {
                        $('.loader').show()
                    },
                    complete: function () {
                        $('.loader').hide()

                    }
                });
            }
        }); // end of PersonalUsersLogTable DataTable method
    }
    // end of Code used to Bind Data to Table

BindPersonalUsersLogDataTable方法的调用在C＃文件中。 在BindPersonalUsersLogDataTable ，我将编写代码来确定登录的用户是管理员还是普通用户。

如果登录的用户是普通用户，那么我想动态地使jQuery DataTable中的某些列不可见。

能否请您告诉我我需要对上述代码进行更改才能获得所需的功能？

Answer 1

您可以使用column().visible()或columns().visible() API方法动态显示/隐藏单个列或一组列。

"success": function (msg) {
   var api = $('#PersonalUsersLogTable').DataTable();

   var json = jQuery.parseJSON(msg.d);

   // Enable/disable columns based on user type            
   if(json.isAdminUser){
      api.columns([2,3]).visible(true);
   } else {
      api.columns([2,3]).visible(false);
   }

   fnCallback(json);
},