Hi
I'm new in datatables, I use codeigniter and ignited Datatables.
I want to make indiviudal column filtering by selecting options on the bottom table
http://nevada.pl/datatables/server_side_test2.html
My controler:
please advice?
thank you
I'm new in datatables, I use codeigniter and ignited Datatables.
I want to make indiviudal column filtering by selecting options on the bottom table
http://nevada.pl/datatables/server_side_test2.html
My controler:
public function getdata() { $this->load->library("Datatables"); $this->datatables ->select('id,name,surname') ->from('users') ->add_column('action', '<a href="#" title="Edit" class="with-tip"><img src="'. base_url().'/commons/images/edit.png" width="24" height="24"></a> <a href="#" id="$1" title="Delete" class="with-tip delete"><img src="'. base_url().'/commons/images/delete.png" width="24" height="24"></a>', 'zlec_id') ; echo $this->datatables->generate(); }My view:
<script type="text/javascript" charset="utf-8"> (function($) { $.fn.dataTableExt.oApi.fnGetColumnData = function ( oSettings, iColumn, bUnique, bFiltered, bIgnoreEmpty ) { if ( typeof iColumn == "undefined" ) return new Array(); if ( typeof bUnique == "undefined" ) bUnique = true; if ( typeof bFiltered == "undefined" ) bFiltered = true; if ( typeof bIgnoreEmpty == "undefined" ) bIgnoreEmpty = true; var aiRows; if (bFiltered == true) aiRows = oSettings.aiDisplay; else aiRows = oSettings.aiDisplayMaster; // all row numbers var asResultData = new Array(); for (var i=0,c=aiRows.length; i<c; i++) { iRow = aiRows[i]; var aData = this.fnGetData(iRow); var sValue = aData[iColumn]; if (bIgnoreEmpty == true && sValue.length == 0) continue; else if (bUnique == true && jQuery.inArray(sValue, asResultData) > -1) continue; else asResultData.push(sValue); } return asResultData; }}(jQuery)); function fnCreateSelect( aData ) { var r='<select><option value=""></option>', i, iLen=aData.length; for ( i=0 ; i<iLen ; i++ ) { r += '<option value="'+aData[i]+'">'+aData[i]+'</option>'; } return r+'</select>'; } $(document).ready(function() { var oTable = $('#example').dataTable( { "bProcessing": true, "bServerSide": true, "sAjaxSource": "getdata", "fnServerData": function ( sSource, aoData, fnCallback ) { $.ajax( { "dataType": 'json', "type": "POST", "url": sSource, "data": aoData, "success": function(json, textStatus, jqXHR) { if ( json.sEcho == 1 ) { $("tfoot th").each( function (i) { this.innerHTML = fnCreateSelect(json.select[i]); $('select', this).change( function () { oTable.fnFilter( $(this).val(), i ); } ); } ); } fnCallback(json) } } ); }, } ); } ); </script> <table cellpadding="0" cellspacing="0" border="0" class="display" id="example"> <thead> <tr> <th>id</th> <th>name</th> <th>surname</th> </tr> </thead> <tbody> <tr> <td colspan="37" class="dataTables_empty">Loading data from server</td> </tr> </tbody> <tfoot> <tr> <th>id</th> <th>name</th> <th>surname</th> </tr> </tfoot> </table>In firebug I got error: TypeError: json.select is undefined this.innerHTML = fnCreateSelect(json.select[i]);
please advice?
thank you