Скрытие столбца Datatables при загрузке страницы с последующим использованием флажка, чтобы показать или скрыть его

Question

Извините, если это глупый вопрос, но вот что мне нужно сделать. Когда страница загружается, у меня есть столбец DT, который необходимо скрыть. У меня флажок на странице будет либо показывать, либо скрывать столбец в зависимости от того, установлен ли флажок. Есть ли способ сделать это с помощью комбинации методов jquery и datatables? Я пробовал кое-что, где я скрываю столбец при загрузке страницы с помощью jquery, но когда вы устанавливаете флажок и перезагружаете страницу, она работает неправильно (возможно, из-за таблицы и того, как она перерисовывается). Код ниже.

 if (!userAccountsDTO) { 
    userAccountsDTO = $adminUserAccountsTable.DataTable({
      destroy:true,
      data:normalizedData,
      columns:userAccountsMap,
      autoWidth:false,
      paging:false,
      dom:'lftip',
       2 = user name, 0 = invisible child indicator sort
       orderFixed: {
       post: [[2,'desc'],[0, 'desc']]
      },
      order:[4,'asc'],
      language:{
        search:'',
        searchPlaceholder:ax.L(5008),
        emptyTable: ax.L(905),
        zeroRecords: ax.L(905),
        info: tableFilters.info,
        infoFiltered: tableFilters.infoFiltered,
        infoEmpty: tableFilters.info
      },
      rowCallback:function(row, data, index) {
        var $row = $(row);
        var uname = data.username.replace(/[@._#]/gi,'-');
        var id = data.id;
        $row.data('username',uname);
        $row.data('id',id);
        if (!data.enabled) {
          $row.addClass('row-disabled');
        }
        if (data.current_profile.id != data.default_profile.id) {
          $row.addClass('childrow un-'+id);
        } else {
          $row.addClass('parentrow un-'+id);
        } 
      }
    });

    ax.Utils.setupTableFiltering($adminUserAccountsTable, userAccountsDTO, MAX_RESULTS, { visibleOnly: true });
     var $profileColumnHidden = $adminUserAccountsTable.find('.admin-user-accounts-profile-column').hide();


  } else {
    userAccountsDTO.clear();
    userAccountsDTO.search('');        
    userAccountsDTO.rows.add(normalizedData);
    userAccountsDTO.draw();
  }   

 //Checkbox

 $adminUserAccountsShowHideProfiles.change(function(e) {
  var $profileChildRows = $adminUserAccountsTable.find('tr.childrow');
  var $profileColumn = $adminUserAccountsTable.find('.admin-user-accounts-profile-column');
  if ( $(this).is(':checked') ) { 
    $profileChildRows.show();
    $profileColumn.show(); 
  } else  { 
    $profileChildRows.hide();
    $profileColumn.hide(); 
  }
 });

Answer 1

создать класс css для сокрытия определенного столбца.

table.hide_col tr > td:nth-child(1){
  display:none
}
table.hide_col tr > th:nth-child(1){
  display:none
}

добавить / удалить класс при отметке флажка

 $('table').addClass('hide_col')
  $('#chkShow').on('click', function(){
   $('table').toggleClass('hide_col')
  });

http://jsfiddle.net/ercanpeker/0kpmjd1u/