Hi,

I have a datatable and I'd like to hide one of the columns. I've used "bVisible : false" but it doesn't seem to work.
Below is my code:

var validatedActivitiesTable = $('#validatedActivitiesTable')
                .DataTable(
                        {
                            "sDom" : "<'dt-toolbar'<'pull-left'f><'pull-right'C><'pull-right margin-right-5'l>r>"
                                    + "t"
                                    + "<'dt-toolbar-footer'<'col-sm-6 col-xs-12 hidden-xs'i><'col-sm-6 col-xs-12'p>>",
                            "autoWidth" : true,
                            "bStateSave" : true,
                            "preDrawCallback" : function() {
                                // Initialize the responsive datatables helper once.
                                if (!responsiveHelper_validatedActivitiesTable_col_reorder) {
                                    responsiveHelper_validatedActivitiesTable_col_reorder = new ResponsiveDatatablesHelper(
                                            $('#validatedActivitiesTable'),
                                            breakpointDefinition);
                                }
                            },
                            "rowCallback" : function(nRow) {
                                responsiveHelper_validatedActivitiesTable_col_reorder
                                        .createExpandIcon(nRow);
                            },
                            "drawCallback" : function(
                                    oSettings) {
                                responsiveHelper_validatedActivitiesTable_col_reorder
                                        .respond();
                            },
                            "aoColumns" : [ null, null, null, null, null, null, null, null, null, { "bVisible" : false} , null, null, null, null ],
                            "order" : [ [ 0, "asc" ] ],
                            "fnInitComplete": function() {
                                var oSettings = $('#validatedActivitiesTable').dataTable().fnSettings();
                                for ( var i=0 ; i<oSettings.aoPreSearchCols.length ; i++ ){
                                    oSettings.aoPreSearchCols[i].sSearch = '';
                                }
                            }
                        }).search("").draw(false);

I'm not sure why it doesn't work because I'm pretty sure the syntax is correct. Did I do anything wrong in the code? Please kindly help.

Thank you in advance.

Hi
On the page http://datatables.net/extensions/colvis/options the 'groups' option is missing but presented in examples: http://datatables.net/release-datatables/extensions/ColVis/examples/group_columns.html. Could you please add the option to the Options documentation page?

Please provide LICENSE (or similar) file with explicit information under what license(s) ColVis is distributed.

Thank you!

In jQuery 1.9, the usage of .attr() and .prop() have changed. See the jQuery 1.9 upgrade guide.

This affects the following pieces of code in ColVis:

For checking a checkbox

Incorrect:

$('input', this.dom.buttons[i]).attr('checked','checked');

Correct:

$('input', this.dom.buttons[i]).prop('checked', true);

For un-checking a checkbox

Incorrect:

$('input', this.dom.buttons[i]).removeAttr('checked');

Correct:

$('input', this.dom.buttons[i]).prop('checked', false);

So if you go to http://datatables.net/release-datatables/extensions/FixedColumns/examples/colvis.html and hide the first column you'll notice Last Name is populated with data from the Position column.

I'm having the exact same issue in my own project.

Any ideas on how to fix it?

Currently, the stateChange callback is the last function to be called after hiding/showing a column (colVis.js:640).

If stateChange callback is moved to a place before the other callbacks, then an application can know which column was hidden/shown before the table redraws. The main use case for this is when I'm tracking column visibility outside of the dataTables API and need to use it during one of the other callbacks, like createdRow or rowCallback. I add data-* attributes to DOM elements during the other callbacks based on which columns are visible.

This line is incompatible with jQuery 1.9:

if ( $.browser.msie && $.browser.version == "6.0" )

From the jQuery 1.9 upgrade guide:

The jQuery.browser() method has been deprecated since jQuery 1.3 and is removed in 1.9. If needed, it is available as part of the jQuery Migrate plugin. We recommend using feature detection with a library such as Modernizr.

It seems the options for resolving this could be:

1. Require the jQuery Migrate plugin and use the existing code
2. Require Modernizr, and rewrite this condition as a Modernizr call
3. Drop IE6 support and remove this block

None are really ideal. I've just commented out this section since we don't need to support IE6 in my project.

Wanted to make a pull request, not an issue.

Hi,

Currently aiExclude only accepts integers, but if your columns have an mDataProp (or sName) defined, we should be able to use those names. Using colreorder makes column numbers useless.

Great work on this!

On line 434.
I'm using dataTables 1.9.4. Newest TableTools and newest ColVis.

Whenever I'm trying to initialize colVis for any of tables I get this error.

Code for initialization:
var table = $('table.datatable').dataTable()

var colvis = new $.fn.dataTable.ColVis( table );

$( colvis.button() ).insertAfter('div.info');

When using state saving the restore button uses the visibility settings from the loaded state instead of the original once that was given when creating the DataTable.

I think it makes more sense to use the original once.

Hi,
We use datatables-colvis as a dependency in our PatternFly toolkit (patternfly.org), however some of our consumers only use NPM to install PatternFly, so they currently can not get the datatables-colvis dependency since there isn't currently an official published NPM package for datatables-colvis.

We are planning on publishing an NPM for datatables-colvis, but it would be ideal if there was an official NPM.

Thanks,
Dave Taylor

Hi,

I am using Composer for my projects and I really loved the possibility to install datatables with composer even if it is more a js project.
Could you include a composer.json so that also can install this plugin with composer ?

thx

There is no min files in the bower package. It would be nice to have.

It seems the DataTables object doesn't have a fnSettings method anymore. It does have a settings() method. I fixed the code by changing it to this, no idea if this is correct, but it's working for me.

    //nTable = oTable.fnSettings().nTable;
    nTable = oTable.settings()[0].nTable;

More or less as the title says - would be good if the exclude array accepted columns names (columns.name) as well as index positions.

Hey, maintainer(s) of DataTables/ColVis!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library DataTables/ColVis is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "DataTables/ColVis",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!

While the button text can freely be set at init time, it seems to me there's no real support for i18n. It would be quite useful if ColVis for example used DataTables' i18n facility.

It's possible to bind on table removal (http://stackoverflow.com/questions/2200494/jquery-trigger-event-when-an-element-is-removed-from-the-dom).
What do you think ?

In Firefox 4.0.1 click events on a <button> element do not get propagated down to child input elements. This is expected since the the (button standard)[http://www.w3.org/TR/html4/interact/forms.html#h-17.5] does not allow for nesting of <input> fields inside a button.

This means that clicks on the <button> element in the Show / Hide dropdown list do not change the <input type='checkbox>
settings. I would suggest switching the <button> over to a <div> and applying styling manually or removing the checkbox and storing column-visibility state elsewhere.

ColVis' stateChange callback function only triggers when an user clicks within a list item's label's content. The callback function doesn't trigger if an user clicks anywhere else in the list item.

http://jsfiddle.net/fL17ev1t/

rebuild method has following code to clear this.dom.buttons collection:

this.dom.buttons.splice(0, this.dom.buttons.length);

But there is no code to clear this.dom.groupButtons collection, following would do:

this.dom.groupButtons.splice(0, this.dom.groupButtons.length);

As a result, calling rebuild() does not rebuilds checked and indeterminate properties' values on input elements.