Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82109

Column Filter Widgets - lost css style for toolbar ui

$
0
0
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 82109

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>