DataTable column filter woes

drpuddingq

I am having two problems while implementing the column filter plug-in using Ajax Source filtering
1. on any text filter, I'm getting "k is undefined" error, suggesting a malformed table, I believe
2. I can't declare a "select" type filter unless I include values, and even then I get error #1, above

Below is the code I have in place, and below that is code THAT WORKS but without the plug-in, suggesting it's not a malformed table but something my newbie brain can't grasp. I really like the plug-in features, and would love to get it working.

Unfortunately, this is only on my local machine, not on a public server.

[code]

var oTable;
$(document).ready(function() {

oTable = $('#users').dataTable( {
"sDom": "<'row'<'col-md-6'l><'col-md-6'f>r>t<'row'<'col-md-6'i><'col-md-6'p>>",
"sPaginationType": "bootstrap",
"oLanguage": {
// _MENU_ is replace with a default menu, which can be changed
// http://datatables.net/usage/i18n
"sLengthMenu": "_MENU_ records per page"
},
"bLengthChange": false,
"iDisplayLength": 50,
"aaSorting": [[ 1, "asc" ]],
"aoColumnDefs": [
{ "bSearchable": true, "aTargets": [ 0,1,4 ] },
{ "bSearchable": false, "aTargets": [ 2,3,5,6 ] },
{ "bSortable": true, "aTargets": [ 0,1,4 ] },
{ "bSortable": false, "aTargets": [ 2,3,5,6 ] },
],
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "{{ URL::to('admin/users/data') }}",
"fnDrawCallback": function ( oSettings ) {
$(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
}
}).columnFilter({
aoColumns: [
{ type: "text"},
{ type: "select" },
null,
null,
{ type: "text" },
null,
null
]
});
});

[/code]

And this works ...

[code]


(function($) {
/*
* Function: fnGetColumnData
* Purpose: Return an array of table values from a particular column.
* Returns: array string: 1d data array
* Inputs: object:oSettings - dataTable settings object. This is always the last argument past to the function
* int:iColumn - the id of the column to extract the data from
* bool:bUnique - optional - if set to false duplicated values are not filtered out
* bool:bFiltered - optional - if set to false all the table data is used (not only the filtered)
* bool:bIgnoreEmpty - optional - if set to false empty values are not filtered from the result array
* Author: Benedikt Forchhammer
*/
$.fn.dataTableExt.oApi.fnGetColumnData = function ( oSettings, iColumn, bUnique, bFiltered, bIgnoreEmpty ) {
// check that we have a column id
if ( typeof iColumn == "undefined" ) return new Array();

// by default we only want unique data
if ( typeof bUnique == "undefined" ) bUnique = true;

// by default we do want to only look at filtered data
if ( typeof bFiltered == "undefined" ) bFiltered = true;

// by default we do not want to include empty values
if ( typeof bIgnoreEmpty == "undefined" ) bIgnoreEmpty = true;

// list of rows which we're going to loop through
var aiRows;

// use only filtered rows
if (bFiltered == true) aiRows = oSettings.aiDisplay;
// use all rows
else aiRows = oSettings.aiDisplayMaster; // all row numbers

// set up data array
var asResultData = new Array();

for (var i=0,c=aiRows.length; i -1) continue;

// else push the value onto the result data array
else asResultData.push(sValue);
}

return asResultData;
}}(jQuery));

function fnCreateSelect( aData )
{
var r='', i, iLen=aData.length;
for ( i=0 ; i

allan

The column filter is a 3rd party add on, so I'm not sure how much help we'll be able to offer here. My guess is that it is having a problem with server-side processing (indeed, unless you send the whole data for the `select` filter column, its never going to work for that). Perhaps try initialising the column filter plug-in in fnInitComplete ? Beyond that, asking in their issue tracker I think is probably the best way to proceed.

Allan

drpuddingq

Thanks, Allan. Will deal with in their issue tracker.
Am using the DataTables filter scheme for now, which does work fine for me.