Status: Solved
Priority: Medium
Security: Public
Views: 1757
Last Modified: 2013-01-10

jquery datatables server side update to filter out inactive records

I have the following jQuery datatables initialization code and on the page

pTable = $('#myTable').dataTable({
					"bProcessing": true,
					"bServerSide": true,
					"bStateSave": false,
					"bAutoWidth:":false,
					"iDisplayLength":8,
					"sAjaxSource":"myServerSideScript”
					"bLengthChange": false
		}

Open in new window

Additionally I have a checkbox on the page above myTable that allows a user to see only records with an “active” status.

 Only active <input id="active" onClick="showActive(this)" type="checkbox" name="selected">							   
		</form>

Open in new window

I’m not certain what dataTables API to use (if there is even one) to accomplish this. Something like pTable.fnFilter(‘active’) but that keeps all the filtering and sorting already present in the table. Is there a function to update the server side call but maintain the filtering and sorting?
Thanks!

HyperBPP

Asked: 2013-01-08

Advertise Here

1 Solution

LVL 1

tjyoungCommented: 2013-01-09

Hi,
yes that is doable, no problem. Might want to use 2 radio buttons. Show active, show all or something like that. I've attached a jpeg of one of my tables showing filters in use. Relevant code for my table radio button other then the jquery for theshown below:

"fnServerParams": function ( aoData ) {
            aoData.push( {"name": "calltype", "value": $('input:radio[name="calltype"]:checked').val()} )
            },

You also need the fnReload linked up (check datatables.net, not sure on the name, might be fnDraw?). That is called when you click the radio button and reloads the table.

//radio button code calling the fnDraw
$("input:radio[name='calltype']").click( function () {
oTable.fnPageChange( 'first', false );
      oTable.fnDraw();
      } );