My Date Range Search Implementation using Server Side Processing

I thought I would post how I implemented date range using server side processing since I spent a good deal of time putting together different hints though out this forum. So here are the bits and pieces that made my basic version work (before I go on and make it fancy :)

//import one of those jquery css styles that has datepicker defined in it.

//first I added some search fields for min and max date:

<p>Min date: <input type="text" id="min"></p>
      <p>Max date: <input type="text" id="max"></p>

//Below is the part where you initialize your table (I have multiple tables that are launched with buttons.. so ignore the displayTable function and the passing of table name and key.. unless this is a functionality your looking for then by all means have a look :)

//pay attention to the fnServerParams section, this is where the min and max variables are pushed to the serverside_processing script.

 <script>
    var oTable; 
    var asInitVals = new Array();
         
    function displayTable(table,key,css_table){

      $(document).ready(function(){
	 $.datepicker.regional[""].dateFormat = 'yy-mm-dd'; //Here I do this because the date format i use in mysql is yyyy-mm-dd ( I know i said //yyyy-mm-dd and the code says yy-mm-dd... don't know why but somehow datepicker translates yy to yyyy. 
          $.datepicker.setDefaults($.datepicker.regional['']);
	 oTable = $(css_table).dataTable({
          "sPaginationType": "full_numbers",
      "bjQueryUI":true,
      
      "sScrollY": "100%",
      "sScrollXInner": "150%",
		"bScrollCollapse": true,
                  
       "sDom": 'T<"clear"><"fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix"lfr>RtS<"fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix"ip>',
       "oTableTools": {
			"sSwfPath": "datatables/extras/TableTools-2.0.1/media/swf/copy_cvs_xls_pdf.swf"
		},
	"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
        "oLanguage": {
			"sSearch": "Search:"
		},
      
      'bProcessing':true, 
  'bServerSide':true,
  
  'bAutoWidth': true,
 
  'sAjaxSource':'server_processing.php',
  "fnInitComplete": function() {
                oTable.fnAdjustColumnSizing();
         },
  "fnServerParams": function (aoData, fnCallback) {
					  aoData.push( { "name": "table", "value": table } );
					  aoData.push( { "name": "key", "value": key } );
                                          aoData.push(  {"name": "min", "value":  $('#min').val() } );
                                          aoData.push(  {"name": "max", "value":  $('#max').val() } );
					},
					
	 
      });
        

//Below this I have the following, this makes those fancy calendars appear when you click your min/max input boxs

 $( "#min" ).datepicker( {
    "onSelect": function(date) {
      min = new Date(date).getTime();
      oTable.fnDraw();
    }
  } ).keyup( function () {
      min= new Date(this.value).getTime();
      oTable.fnDraw();
  } );
  
  $( "#max" ).datepicker( {
    "onSelect": function(date) {
      max = new Date(date).getTime();
      oTable.fnDraw();
    }
  } ).keyup( function () {
      max = new Date(this.value).getTime();
      oTable.fnDraw();
  } );
	  
	
      });

}//end displayTable functions

//Now for the section I added to server_processing.php... its very basic.. so should help you get a good understanding of how this all works.
//I added this right below the filter section that is already there

	
	if(isset($_GET['min']) && isset($_GET['max']) && $_GET['min'] != '' && $_GET['max'] != ''){
		$sWhere = "WHERE usage_date BETWEEN '$_GET[min]' AND '$_GET[max]'";
	}

Hope this helps someone down the line!
Enjoy,
Marina