Quantcast
Channel: DataTables 1.9 — DataTables forums
Viewing all articles
Browse latest Browse all 1817

Show/hide hidden columns that are hidden at DataTables initialization

$
0
0
HI,

I would like to use the fnShowHide function provided by the API to show hide/columns and be able to use colReorder too.

I don't know how to retrieve the good index. The code after show what I want to do, the method toggleColumnVisibility is call when clicking on a checkbox.
- When clicking on a hidden column checkbox, the good one is displayed but another is replaced by a hidden one...
- When clicking on a visible column checkbox, a null pointer exception occurs.
Can you help me to fix this?

HTML:
<input type="checkbox" onclick="toggleColumnVisibility('creation_date')" name="creation_date" id="creation_date">

Datatable initialization:
$.getJSON("/url", data, function (json) {
				// Fill datatable with data
			    $("#myDataTable").dataTable( {
			    	"sDom": 'Rlfrtip', 
			        "bPaginate": true,
			        "bAutoWitdh": true,
			        "sPaginationType": "full_numbers",
			        "aaData": json.aaData,
			        "aoColumns": json.aoColumns // Some columns are hidden using "bVisible": false
			    });

JS
function fnShowHide( iCol ) {
	var oTable = $('#myDataTable').dataTable();
	var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
	oTable.fnSetColumnVis( iCol, bVis ? false : true );
}
function getColumnIndexByName(name) {
	return $("#myDataTableZone thead th:contains('"+name+"')").index();
}
function toggleColumnVisibility(name) {
	var index = getColumnIndexByName(name);
	if (getColumnIndexByName(name) == -1) {
		console.log("Column is not visible in DataTable");
		var oTable = $("#myDataTable").dataTable();

		$.each(oTable.fnSettings().aoColumns, function (key, value) { 
			if (value.sTitle == name) { 
				var index = value._ColReorder_iOrigCol;
				fnShowHide(index);
				return false; // quit loop
			}
		});
	} else {
		fnShowHide(getColumnIndexByName(name));
	}
}

Viewing all articles
Browse latest Browse all 1817

Trending Articles