Quantcast
Viewing all articles
Browse latest Browse all 82155

Column Filter Widgets - lost css style for toolbar ui

Hi,

I've managed to integrate Column Filter Widgets and date picker to my DT. The problem I'm facing is that I've lost css formatting for
<div class="fg-toolbar ui-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix">
. It's a small thing but it really visually breaks my table.

Here is the link:
http://imageshack.us/photo/my-images/20/36075761.jpg/

and code:

<script type="text/javascript" charset="utf-8">
		var minDateFilter;
var maxDateFilter;

$.fn.dataTableExt.afnFiltering.push(
  function( oSettings, aData, iDataIndex ) {
    if ( typeof aData._date == 'undefined' ) {
      aData._date = new Date(aData[6]).getTime();
    }
    
    if ( minDateFilter && !isNaN(minDateFilter) ) {
      if ( aData._date < minDateFilter ) {
        return false;
      }
    }
    
    if ( maxDateFilter && !isNaN(maxDateFilter) ) {
      if ( aData._date > maxDateFilter ) {
        return false;
      }
    }
    
    return true;
  }
);
		$(document).ready( function () {
				var oTable = $('#example').dataTable( {
				"bPaginate": true,
					"bJQueryUI": true,
		
					"sDom": 'W<"clear">lfrtip',
					"oColumnFilterWidgets": {
					"aiExclude": [ 0, 2, 6, 7, 9, 10]
					}


				} );
				$( "#datepicker_min" ).datepicker( {
    "onSelect": function(date) {
      minDateFilter = new Date(date).getTime();
      oTable.fnDraw();
    }
  } ).keyup( function () {
      minDateFilter = new Date(this.value).getTime();
      oTable.fnDraw();
  } );
  
  $( "#datepicker_max" ).datepicker( {
    "onSelect": function(date) {
      maxDateFilter = new Date(date).getTime();
      oTable.fnDraw();
    }
  } ).keyup( function () {
      maxDateFilter = new Date(this.value).getTime();
      oTable.fnDraw();
  } );
} );
			


			
		</script>
		<script type="text/javascript">
        $(function () {
            $("#tabs").tabs({ selected: 0 });
         		$( "input:submit, a, button", ".buttons" ).button();
		        $( "a", ".buttons" ).click(function() { return false; });
        });
    </script>

Any help would be much appreciated. Do I need to enable sth?ny

Viewing all articles
Browse latest Browse all 82155

Trending Articles